html5视频弹窗 – 随身笔记

HTML:

<link rel="stylesheet" type="text/css" href="css/jquery.fancybox.css" media="screen" />

<a id="video_img" class="fancybox-media float_r" href="https://www.honhe.com">

<script src="js/jquery-1.8.3.min.js"></script>
<script src="js/jquery.honhe.js"></script>
<!--视频弹窗-->
<script type="text/javascript" src="js/jquery.pack.js"></script>
<script type="text/javascript" src="js/jquery.media.js"></script>
<!--视频弹窗-->

修改jquery.media.js

jquery.media

修改video.html

<video width="784" controls="controls" autoplay="autoplay">
 <!--<source src="movie.ogg" type="video/ogg">-->
 <source src="https://dn-vtu799qe.qbox.me/fe63682523e253c3.mp4" type="video/mp4">
 您的浏览器不支持视频播放。
</video>

案例下载

如果想添加视频播放记录功能可以参考《html5记录缓存video视频播放记录》