加载Loading 让网页加载完后显示

By柏小白

加载Loading 让网页加载完后显示

初次渲染页面页面闪动处理方法:

一个JavaScript网页加载特效,当网页没有加载完成时,会一直显示出这个Loading,当Loading结束后,再会显示网页内容。

现在很多网站仍然在用的网页进度条效果。

//页面加载完成后影藏 loading
function subSomething(){
  if(document.readyState == "complete") // 当前页面状态
  $("#webloading").fadeOut(500,function(){
    $(this).remove();
  });
}
document.onreadystatechange = subSomething;  // 当前页面状态改变的时候执行这个方法
<div id="webloading"></div>

加上定时器

function subSomething() {

var timeId=setInterval(function(){
if (document.readyState == "complete") { // 当前页面状态
    $("#webloading").fadeOut(500, function() {
      $(this).remove();
       clearInterval(timeId);
    });
 
  }

}, 1000)

}

 






Document



About the author

柏小白 administrator