<style type="text/css">
#loading {
 width: 100%; 
 height: 100%; 
 top: 0px;
 left: 0px;
 position: fixed; 
 display: block; 
 opacity: 0.7; 
 background-color: #fff; 
 z-index: 99; 
 text-align: center; } 
 
#loading-image { 
 position: absolute; 
 top: 100px;  <-- 이부분과
 left: 240px;  <-- 이부분을 50% 로 하면 화면 정 가운데에 로딩 이미지가 나타난다
 z-index: 100; }
</style>

<div id="loading"><img id="loading-image" src="/imgs/ajax-loader.gif" alt="Loading..." /></div>
<div>
 <img src = "/imgs/sample/cutyDog.jpg">
</div>

<script language="javascript" type="text/javascript"> 
$(window).load(function() {   
 $('#loading').hide(); 
});
</script>

---
별거 아니구먼요