Bootstrap模態(tài)框插入視頻的實(shí)現(xiàn)代碼
更新時(shí)間：2017年06月25日 09:10:19 作者：XuLinJie_
這篇文章主要介紹了Bootstrap模態(tài)框插入視頻的實(shí)現(xiàn)代碼,需要的朋友可以參考下
下面代碼實(shí)現(xiàn)別忘了前提是要在bootstrap框架下使用
效果
點(diǎn)擊模態(tài)框
跳出自己已做好的MP4等格式視頻
Bootstrap代碼
<button type="button" class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-lg">模態(tài)框</button> <div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel"> <div class="modal-dialog modal-lg" role="document"> <div class="modal-content"> ...< --這里寫插入視頻代碼 -- > </div> </div> </div>
三、插入視頻代碼
注意video一些必要代碼。如需解決兼容可以看這篇博客http://blog.csdn.net/w_linux/article/details/62890202
<video src="image/小“塍”故事.mp4" height="500" controls preload="metadata"></video>
四、總代碼（我這里做了點(diǎn)改動(dòng)，沒有放在button里，問題不大）
<a data-toggle="modal" data-target=".bs-example-modal-lg">模態(tài)框</a> <!-- Large modal --> <div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel"> <div class="modal-dialog modal-lg" role="document"> <div class="modal-content"> <video src="image/小“塍”故事.mp4" height="500" controls preload="metadata"></video> </div> </div> </div>
以上所述是小編給大家介紹的Bootstrap模態(tài)框插入視頻的實(shí)現(xiàn)代碼，希望對大家有所幫助，如果大家有任何疑問歡迎給我留言，小編會及時(shí)回復(fù)大家的！
相關(guān)文章
這篇文章主要介紹了JavaScript如何獲取一個(gè)元素的樣式信息,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-07-07
Javascript實(shí)現(xiàn)鼠標(biāo)點(diǎn)擊冒泡特效
這篇文章主要為大家詳細(xì)介紹了Javascript實(shí)現(xiàn)鼠標(biāo)點(diǎn)擊冒泡特效，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-12-12
javascript常見數(shù)字進(jìn)制轉(zhuǎn)換實(shí)例分析
這篇文章主要介紹了javascript常見數(shù)字進(jìn)制轉(zhuǎn)換,結(jié)合實(shí)例形式分析了JavaScript十進(jìn)制,十六進(jìn)制及二進(jìn)制的相互轉(zhuǎn)換原理與技巧,需要的朋友可以參考下2016-04-04
這篇文章主要介紹了JavaScript刪除指定子元素代碼實(shí)例,本文給出了代碼實(shí)例和實(shí)現(xiàn)代碼解釋,需要的朋友可以參考下2015-01-01
JavaScript 實(shí)現(xiàn)完美兼容多瀏覽器的復(fù)制功能代碼
這兩天在做Web前端時(shí)，遇到需求通過js實(shí)現(xiàn)文本復(fù)制的功能。經(jīng)過一番測試，終于實(shí)現(xiàn)了出來，有需要的小伙伴可以參考下。2015-04-04
這篇文章主要介紹了微信小程序表單驗(yàn)證WxValidate的使用，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-11-11
JS數(shù)組返回去重后數(shù)據(jù)的方法解析
本文主要分享了Js數(shù)組返回去重后的數(shù)據(jù)的實(shí)例代碼。具有一定的參考價(jià)值，下面跟著小編一起來看下吧2017-01-01
layui表格內(nèi)放置圖片,并點(diǎn)擊放大的實(shí)例
今天小編就為大家分享一篇layui表格內(nèi)放置圖片,并點(diǎn)擊放大的實(shí)例，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
大家有沒有想過，一段javascript腳本從載入瀏覽器到顯示執(zhí)行都經(jīng)過了哪些流程，其執(zhí)行次序又是如何。本篇博文將引出'javascript執(zhí)行模型'的概念，并帶領(lǐng)大家理解javascript在執(zhí)行時(shí)的處理機(jī)制。2010-10-10
這篇文章主要介紹了JS兼容所有瀏覽器的DOMContentLoaded事件的相關(guān)資料，標(biāo)準(zhǔn)瀏覽器中，使用DOMContentLoaded事件即可實(shí)現(xiàn)我們的要求，注冊事件處理函數(shù)也極為簡單，感興趣的朋友一起學(xué)習(xí)吧2018-01-01