amazon-s3 - 如何不使用视频播放器和引导程序 3.0 截断我的 div

Question

我正在使用这个模板：

http://getbootstrap.com/examples/offcanvas/

当我把我的 S3 视频播放器放在大尺寸时，就可以了：（ _{来源：free.fr）}

但是如果我减小页面的大小，我会得到这个：（ _{来源：free.fr）}

我的行代码是：

<div class="jumbotron">
        <p><strong>Module 1 :</strong> <a name="un">Introduction</a></p>
        <script type="text/javascript">
    <!-- Script for video S3 -->
    </script>
    <p>Description</p>
      </div>

如何使用 Bootstrap 保持包含我的视频的 div 的宽度？

Answer 1

您还可以添加您使用的 javascript 的示例吗？您必须尝试将嵌入代码的宽度设置为 100%。

我尝试了一些示例代码： http: //www.icanlocalize.com/site/2010/03/using-amazon-s3-to-host-streaming-videos/：

<script src="http://www.onthegosystems.com/mediaplayer/swfobject.js" type="text/javascript"></script>

<div id="mediaspace">This text will be replaced</div>

<script type="text/javascript">// <![CDATA[
var so = new SWFObject('http://www.onthegosystems.com/mediaplayer/player.swf','mpl','640','467','9');
so.addParam('allowfullscreen','true');
so.addParam('allowscriptaccess','always');
so.addParam('wmode','opaque');
so.addVariable('file','http://d1ftqtsbckf6jv.cloudfront.net/using_glossaries.mp4');
so.write('mediaspace');
// ]]></script>

Al 认为这里的宽度是硬编码的，您也可以使用 javascript 对其进行操作：

 $('#mediaspace embed').attr('width','100%');

另请阅读文档的这一部分：http: //getbootstrap.com/getting-started/#third-parties。文档现在有一个谷歌地图示例，但是所有类型的第三方内容都会发生这个问题。

对于 TB2，我使用了这个：How to implement a responsive Youtube embed iframe with Twitter Bootstrap？也应该适用于 TB3。