我正在我的页面上加载屏幕,它将覆盖整个屏幕大约10秒钟,然后它会消失到应该在这10秒内加载的主要内容。
它有效,但delay
功能显示加载屏幕10秒且主要内容在该时间段内没有预加载的问题。我只是淡入内容,然后开始加载。
如何更改功能,而不是只显示加载屏幕,它还会在10秒的持续时间内加载页面上的主要内容。
<script src=‘http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script>
$(function() {
$('<div style="height:100%;width:100%;z-index:1000;background-color:blue;position:absolute;”><br><br><br><center><img src="http://bithumor.co/bh-logo.png" height="100" width="100"></center></div>')
.insertBefore('body')
.delay(6000)
.fadeOut(function() {
$(this).remove();
});
});
</script>
答案 0 :(得分:0)
使用超时来延迟脚本的一部分,与脚本的其余部分异步延迟。
$(function() {
var loading = $('<div style="height:100%;width:100%;z-index:1000;background-color:blue;position:absolute;”><br><br><br><center><img src="http://bithumor.co/bh-logo.png" height="100" width="100"></center></div>');
loading.insertBefore('body');
window.setTimeout(function(){
loading.fadeOut(function() {
$(this).remove();
});
},10000); // 10000 milliseconds = 10 seconds
});