设置Loding延迟加载页面
生活随笔
收集整理的這篇文章主要介紹了
设置Loding延迟加载页面
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
前端頁面:
<div id="loading"> <!--這里放你的loading時顯示的動畫或者文字單獨(dú)放置--> </div>
樣式設(shè)置:
html,body{
height:100%;
100%;
}
body{
overflow: hidden;
}
#loading{
100%;
height:100%;
color:#9f9f9f;
top:0px;
left:0px;
position:absolute; /* fixed */
z-index: 1999;/*用來顯示在最前面*/
text-align: center;
}
/*這里是頁面正常顯示部分,全部設(shè)為display:none*/
.wrapper{
display: none;
}
JS控制加載
$(window).load(function(){
$('#loading').fadeOut();
$('body').css('overflow','scroll');
$('.wrapper').fadeIn();
});
總結(jié)
以上是生活随笔為你收集整理的设置Loding延迟加载页面的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 什么是优秀的程序员
- 下一篇: 如何写好.babelrc?Babel的p