Home  >  Article  >  Web Front-end  >  Share example code for inserting video into Bootstrap modal box

Share example code for inserting video into Bootstrap modal box

PHPz
PHPzOriginal
2017-06-27 15:27:044873browse

This article mainly introduces the implementation code for inserting videos into the Bootstrap modal box. Friends who need it can refer to the Bootstrap tutorial

Don’t forget to implement the following code The premise is to use it under the bootstrap framework

1. Effect

Click on the modal box

Share example code for inserting video into Bootstrap modal box

to jump out of the MP4 you have made Other format videos

Share example code for inserting video into Bootstrap modal box

2. Bootstrap code


<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. Insert video code

Note video some necessary codes. If you need to solve the problem of compatibility, you can read this blog http://blog.csdn.net/w_linux/article/details/62890202


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

IV , the total code (I made some changes here and did not put it in the button, so the problem is not big)


模态框
 

 

The above is the detailed content of Share example code for inserting video into Bootstrap modal box. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn