Bootstrap モーダル ボックスにビデオを挿入するサンプル コードを共有する

この記事では主にBootstrapモーダルボックスに動画を挿入する実装コードを紹介しますので、必要な方は参考にしてくださいBootstrapチュートリアル

以下のコードを忘れずに実装してください。ブートストラップ フレームワーク

1. 効果

モーダル ボックスをクリックして

、作成した MP4 およびその他の形式のビデオをポップアップ表示します

2. ブートストラップ コード

<button type="button" class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-lg">模态框</button>

<p class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
 <p class="modal-dialog modal-lg" role="document">
 <p class="modal-content">
  ...< --这里写插入视频代码 -- >
 </p>
 </p>
</p>

3. ビデオを挿入します。コード

ビデオに必要ないくつかのコードに注意してください。互換性の問題を解決する必要がある場合は、このブログを参照してください。 http://blog.csdn.net/w_linux/article/details/62890202

 <video src="image/小“塍”故事.mp4" height="500" controls preload="metadata"></video>

4. 合計コード (いくつかの変更を加えました)ここにあり、ボタンに入れていませんでしたが、大きな問題ではありません）

模态框
 

 

 

  <video src="image/小“塍”故事.mp4" height="500" controls preload="metadata"></video>
 
 

以上がBootstrap モーダル ボックスにビデオを挿入するサンプル コードを共有するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。