yuheijotaki.com

ローディングのスニペット
細かいcssは抜きにして

<!-- html -->
<p id="loading">loading...</p>
<div id="mainArea">
	メインエリア
</div>

/* css */
div#mainArea {
	display: none;
}

// js
loading = setInterval(function(){
	setTimeout(function(){
		document.getElementById('loading').innerHTML='loading...';
	},250);
	setTimeout(function(){
		document.getElementById('loading').innerHTML='loading';
	},500);
	setTimeout(function(){
		document.getElementById('loading').innerHTML='loading.';
	},750);
	setTimeout(function(){
		document.getElementById('loading').innerHTML='loading..';
	},1000);
},1000);
window.onload = function(){
	document.getElementById('loading').style.display="none";
	document.getElementById('mainArea').style.display="block";
	clearInterval(loading);
}