首页 > 其他 > 详细

设置Loding延迟加载页面

时间:2020-06-15 22:17:23      阅读:43      评论:0      收藏:0      [点我收藏+]

 

 

前端页面:

<div id="loading">
  <!--这里放你的loading时显示的动画或者文字单独放置-->
</div>

  

样式设置:

html,body{
     height:100%;
     width:100%;
}
body{
       overflow: hidden;
}
#loading{           
     width:100%;
     height:100%;
     color:#9f9f9f;
     top:0px;
     left:0px;
     position:absolute; /* fixed */
     z-index: 1999;/*用来显示在最前面*/
     text-align: center;
}
 /*这里是页面正常显示部分,全部设为display:none*/
.wrapper{
        display: none;
}

  

 

JS控制加载

$(window).load(function(){
      $(‘#loading‘).fadeOut();  
      $(‘body‘).css(‘overflow‘,‘scroll‘);
      $(‘.wrapper‘).fadeIn(); 
});

  

设置Loding延迟加载页面

原文:https://www.cnblogs.com/chalkbox/p/13138034.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!