视频未加载/html5

Question

我有一个问题让我发疯，我不知道还能做什么。我从 pixelarity dot com 购买了模板“Formula”。在演示中，该站点在后台循环播放视频。但是，下载版本的背景有不同的视频（名为横幅）。我将要播放的视频复制到图像文件夹（.mp4 和 webm 格式）并使用我的视频名称“forwes”更新了如下所示的代码，但是当我预览页面时它没有加载（它仍然播放下载附带的视频。

任何想法为什么在页面加载时它不播放？请记住，我是网页设计和编码的菜鸟

谢谢！

排除文件扩展名。模板会自动 在支持背景视频的平台上生成多格式*标签，然后直接跳过 踩那些不踩的（退回到您设置为背景图像的任何内容）。

                * Your video must be offered in both .mp4 and .webm formats to work everywhere.
            -->
                <section id="banner" data-video="images/forwes">
                    <div class="inner">
                        <header>
                            <h1>Our Business Name</h1>
                            <p>W we will repair your computers, phones, printers and all other electronic devices. <br />  We provide both in-store support as well as provide full service, onsite IT support for businesses. Contact us for your free consultation today!.</p>
                        </header>
                        <ul class="actions">
                            <li><a href="#" class="button special big">Get Started</a></li>
                        </ul>
                    </div>
                    <a href="#one" class="more">Learn More</a>
                </section>

Answer 1

用正确的视频格式和标签试试这个

.container{
margin: 30px auto;
display:block;
max-width:1200px;
}

<div class="container">
  <video class="video" poster="" id="bgvid" playsinline autoplay muted loop>
            <!-- WCAG general accessibility recommendation is that media such as background video play through only once. Loop turned on for the purposes of illustration; if removed, the end of the video will fade in the same way created by pressing the "Pause" button  -->
            <source src="http://vjs.zencdn.net/v/oceans.mp4" type="video/mp4">
            </source>
            <source src="http://vjs.zencdn.net/v/oceans.webm" type="video/webm">
            </source>
            <source src="http://vjs.zencdn.net/v/oceans.ogv" type="video/ogg">
            </source>
        </video>
</div>