javascript - 如何增加 bigvideo.js 的加载时间？

Question

我的小型网站加载时间非常慢，我做错了什么。
我的意图是在视频加载之前显示图像/*但是图像几乎与视频同时加载，即使它需要很长时间才能加载。

我的 html:

<div id="bigvid">
  <div class="img">
    <div id="header">
      <div class="inner presentation" style="z-index: 999; height: 100%">
        <header>
          <h1 style="
            font-size: 100px;
            line-height: 65px;
            letter-spacing: 12px;
            font-weight: 900;
            margin: 26px 0;
            color: #f5f4ed;
          ">
            hibidabibi 
          </h1>
          <hr>
          <span class="byline" style="
            font-size: 48px;
            line-height: 65px;
            letter-spacing: 12px;
            font-weight: 900;               
            margin: 26px 0;
            color: #f5f4ed;
          ">
            Coming Soon
          </span> 
        </header>
        <footer> 
          <ul class="icons">
            <li><a href="#" class="icon icon-twitter"><span>Twitter</span></a></li>
            <li><a href="#" class="icon icon-youtube"><span>Facebook</span></a></li>
            <li><a href="#" class="icon icon-instagram"><span>Google+</span></a></li>
          </ul> 
        </footer>
      </div>
    </div>
  </div>
</div>

我的CSS

 #bigvid {
   position: absolute;
   background-color: #000;
   height: 100%;
   width: 100%;
   z-index: 100;
   background-image: url('../images/screenshot.jpg');
 }

参见 http://impulse1.github.io/Test/供引用。

Answer 1

您的 body 需要 100% 的高度。背景图片正在加载，它只是没有内容，直到视频加载。视频加载后，它会填充 div，在调整 div 大小和视频填充之间的瞬间，您会看到背景图片。