Bootstrap 3-响应式mp4视频 [英] Bootstrap 3 - Responsive mp4-video

问题描述

我试图在引导站点上找到一个好的解决方案，但是我还没有得到答案.我想我不是唯一一个为此苦苦挣扎的人，但是我找不到任何可以帮助我的东西.

I tried to find a good solution on the bootstrap site but I didn't get an answer to this yet. I think I can't be the only one struggling with this, but I couldn't find anything that helped me.

我正在尝试在我的网站上嵌入mp4视频.问题是，如果我使用iframe标签，则无法使用自动播放和循环播放功能. 因此，我想用一个视频标签(或其他支持自动播放和循环播放的标签)来解决它.之后，我尝试使用对象标签使视频具有响应能力，但这没有用.即使我在我的代码中(向您展示)允许了它，您也可以在下面看到它:

I'm trying to embed an mp4-video on my website. The problem is, that if I use an iframe-tag I can't use autoplay and loop. Because of that I would like to solve it with a video tag (or something else that supports autoplay and loop). After that I tried to make my video responsive with an object-tag but this didn't work. Even though I let it in my code (to show you) which you can see below:

<div align="center">
   <object class="embed-responsive-item">
     <video autoplay loop >
       <source src="file.mp4" />
     </video>
   </object>
 </div>

我希望你们中的任何人都可以帮助我解决此问题.

I hope anyone of you can help me fix this.

推荐答案

据我了解，您希望将视频嵌入到您的网站中:

It is to my understanding that you want to embed a video on your site that:

• 反应灵敏
• 允许自动播放和循环播放
• 使用Bootstrap

此此处的演示就是这样做的.您必须按照此处的说明放置另一个object/embed/iframe标记之外的嵌入类-但是您需要即使未指定视频标签，也可以使用视频标签代替对象标签.

This Demo Here does just that. You have to place another embed class outside of the object/embed/iframe tag as per the the instructions here - but you're also able to use a video tag instead of the object tag even though it's not specified.

<div align="center" class="embed-responsive embed-responsive-16by9">
    <video autoplay loop class="embed-responsive-item">
        <source src="http://techslides.com/demos/sample-videos/small.mp4" type="video/mp4">
    </video>
</div>

这篇关于Bootstrap 3-响应式mp4视频的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！