Question

我找到了这个加载器，但不确定它是否实际加载内容或只是运行数字。我是JavaScript的新手，我希望它能够加载页面，但每次我运行它都会计算所有我看不到它的速度因为heaver图像而变慢，所以我不确定它是否实际上是在加载页面。 / p>

＆＃13;

'use strict';

loader();

function loader(_success) {
    var obj = document.querySelector('.preloader'),
        inner = document.querySelector('.preloader-inner'),
        page = document.querySelector('body');
    obj.classList.add('show');
    page.classList.remove('show');
    var w = 0,
        t = setInterval(function () {
        w = w + 1;
        inner.textContent = w + '';
        if (w === 99) {
            obj.classList.remove('show');
            page.classList.add('show');
            clearInterval(t);
            w = 0;
            if (_success) {
                return _success();
            }
        }
    }, 20);
}

＆＃13;

.preloader {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  z-index: 1000;
}
.preloader-inner {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  text-align: center;
}

.show {
  visibility: visible !important;
  opacity: 1 !important;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="preloader">
    <div class="preloader-inner"></div>    
  </div>

＆＃13;

Answer 1

这不是一个你需要提出的问题。你需要更多地理解语言。我的建议是，如果你使用的是一种你没有写过的方法，那就找出它的作用。例如： setInterval（）

setInterval（）方法以指定的时间间隔（以毫秒为单位）调用函数或计算表达式。请参阅：https://www.w3schools.com/jsref/met_win_setinterval.asp

您的加载程序只是以20毫秒的间隔将数字从0增加到99。只是一个循环。

有足够的库可用于实现此类功能并有大量示例。做你的研究。

窗口装载的预装载器

1 个答案: