分享程序员开发的那些事...
更新时间：2023-08-25 15:11:22
有没有必要使用Ajax或东西，只需设置页面的包装DIV的显示的到的没有的。然后改变它的文件的加载时遮挡。在code可能是这样的，使用原始的Javascript：
There's no need to use Ajax or something, simply set the page's wrapper div display to none. then change it to block when the document is loaded. the code might be like this, using raw Javascript:
...
<script type="text/javascript">
function preloader(){
document.getElementById("preloader").style.display = "none";
document.getElementById("container").style.display = "block";
}//preloader
window.onload = preloader;
</script>
<style>
...
div#wrapper {
...
display: none;
}
div#preloader {
top: 0; right: 10px;
position:absolute;
z-index:1000;
width: 132px; height: 38px;
background: url(path/to/preloaderBg.png) no-repeat;
cursor: wait;
text-shadow: 0px 1px 0px #fefefe; //webkit
}
...
</style>
...
<body>
<div id="preloader">Loading... Please Wait.</div>
<div id="wrapper">
<!-- page contents goes here -->
</div>
</body>
...
随意评论，如果你需要这个jQuery中。
feel free to comment, if you need this in jQuery.
更新，在jQuery的：
update, in jQuery:
...
<script type="text/javascript">
//use $(window).load(fn) if you need to load "all" page content including images, frames, etc.
$(document).ready(function(){
$("#preloader").hide();
$("#container").show();
});
</script>
...
相关文档：活动/ 准备，活动/的负荷，CSS / CSS 和放大器;核心/ $
Related documents: Events/ready, Events/load, CSS/css & Core/$