我正在使用 Bootstrap 构建网页
我使用的模板:http://startbootstrap.com/template-overviews/agency/
我的问题是我想将带有大图像的标题更改为视频
(此处为示例:http://riskeverything.us/)
首先我认为我只需要抛出类似 <video></<video> tag
的东西进入<div></div>
block ,以及 css
和 js
bootstrap 将完成剩下的工作,但它失败了!
部分代码已修改:
```
<header>
<div class="container">
<div class="intro-video">
<video id="video" preload autoplay loop="loop" muted="muted" volume="0">
<source src="./one.mp4" type="video/mp4">
Video not supported
</video>
</div>
<div class="intro-text">
<div class="intro-lead-in">Welcome To Our Studio!</div>
<div class="intro-heading">It's Nice To Meet You</div>
<a href="#services" class="page-scroll btn btn-xl">Tell Me More</a>
</div>
</div>
```
有人能告诉我应该做什么进一步的工作吗?
谢谢!
最佳答案
你是对的 - 只需 <video></video>
带有一些 CSS 的元素应该可以工作:http://take.ms/RWHMi
但更重要的是您需要特定格式的视频http://take.ms/AuK1p
在这里你有工作示例http://jsfiddle.net/h8rrhoua/
您也可以使用代码停止播放电影:window.addEventListener('scroll', function(){
document.querySelector("#video").pause();
});
恕我直言,这项工作不需要 Bootstrap
关于javascript - 使用 Bootstrap 时创建视频头,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27617563/