页面加载栏,直到整个页面加载?

Lou*_*key 5 jquery

可能重复:
脚本运行时加载栏

嗨,我有很多有图像,并想知道是否有推迟该图像的显示,直到整个页面加载,如可能加载条的方式,但使用jQuery的网页?任何帮助都会很棒.

Gar*_*een 10

当然这很容易用jQuery做.使用该window.load事件确定何时加载所有图像,然后显示内容:

HTML

<html>
<body>
   <div id="loading"></div>

   <div id="container">
       <img src="http://www.playirishlottery.co.uk/wp-content/uploads/image-2.jpg"/>
   </div>

</body>
</html>
Run Code Online (Sandbox Code Playgroud)

jQuery的

$(window).load(function() {
    //show();
});


function show() {
    $('#loading').hide();
    $('#container').fadeIn();
};

setTimeout(show, 3000);
Run Code Online (Sandbox Code Playgroud)

在上面的例子中,我曾经setTimeout只是演示.实际上,你删除它并取消注释.load函数中的show()

小提琴: http ://jsfiddle.net/xM6v9/


Eri*_*lli 3

如果您只想在页面完全加载之前显示某些内容,则不需要 jQuery: http: //jsfiddle.net/ErickPetru/g7D8e/

说明:您的页面内容将位于一个divwith中display: none,另一个div显示加载消息/gif。

您需要将所需的 JS</body>放在<script>. 这样,JS 只会运行之前加载的所有内容。