页面还未加载完成显示loading

页面未加载完成，显示loading的图标

html代码

<div id="loading">
    <i></i>
</div>

css  代码

#loading{
  width: 100%;
  height: 100%;
  background-color: #fff;
  position: fixed;
  top:0;
  left: 0;
  z-index: 9999;
}
 #loading >i{
    width: 64px;
    height: 64px;
    position: absolute;
    top:0;
    bottom:0;
    left:0;
    right: 0;
    margin: auto;
    background: url("/images/loading.gif") no-repeat;
  }

js代码

document.onreadystatechange = function () {
    if(document.readyState === "complete"){
        $("#loading").fadeOut();
    }
}

推荐一款loading图标的网站，可以自己配置颜色背景色

https://icons8.com/preloaders/

欢迎关注我的个人技术公众号！javascript艺术