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

我会在那里放一个更大的视频，看看是否属实。老实说，我可以在视频开始前一秒钟左右看到你的占位符图像。

如果你正在使用chrome ..点击f12加载开发工具。然后切换回浏览器。单击站点上的刷新按钮但按住鼠标按钮，当菜单出现时选择最后一个选项 - “空缓存和硬重新加载”。

此时你可能只是缓存的受害者。

Answer 2

你的身体需要100％的身高。正在加载背景图片，它只是没有内容，直到视频加载。一旦视频加载，它就会填充div，并且在div调整大小和填充视频之间的分秒中，您会看到背景图像。

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

2 个答案: