手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >jquery html5 视频播放控制代码
jquery html5 视频播放控制代码
摘要:jQueryHTML5视频播放控制核心代码:您的浏览器不支持html5!$('video').click(function(){if($(t...

jQuery HTML5 视频播放控制核心代码:

<video controls poster="images/vedio.jpg" width="663" height="373"> <source src="video/Defone3.8_1.mp4" type="video/mp4"> 您的浏览器不支持html5! </video> <script type="text/javascript"> $('video').click(function() { if ($(this).hasClass('pause') ) { $("video").trigger("play"); $(this).removeClass('pause'); $(this).addClass('play'); } else { $("video").trigger("pause"); $(this).removeClass('play'); $(this).addClass('pause'); } }); </script>

如果想正式用户播放环境,建议大家使用jplayer之类的工具

<script type="text/javascript" src="../../lib/jquery.min.js"></script> <script type="text/javascript" src="../../dist/jplayer/jquery.jplayer.min.js"></script> <script type="text/javascript"> //<![CDATA[ $(document).ready(function(){ $("#jquery_jplayer_1").jPlayer({ ready: function (event) { $(this).jPlayer("setMedia", { title: "Bubble", m4a: "http://jplayer.org/audio/m4a/Miaow-07-Bubble.m4a", oga: "http://jplayer.org/audio/ogg/Miaow-07-Bubble.ogg" }); }, swfPath: "../../dist/jplayer", supplied: "m4a, oga", wmode: "window", useStateClassSkin: true, autoBlur: false, smoothPlayBar: true, keyEnabled: true, remainingDuration: true, toggleDuration: true }); }); //]]> </script>

下载地址:http://www.jb51.net/jiaoben/32245.html

jPlayer是一个JavaScript写的完全免费和开源 (MIT) 的jQuery多媒体库插件 (现在也是一个Zepto插件) jPlayer可以让你迅速编写一个跨平台的支持音频和视频播放的网页. jPlayer的丰富API可以让你创建一个个性化多媒体应用,因此也获得越来越多的社区成员的支持和鼓励。

【jquery html5 视频播放控制代码】相关文章:

jquery中添加属性和删除属性

javascript实现youku的视频代码自适应宽度

用javascript动态注释掉HTML代码

Javascript特效:随机显示图片的源代码

jQuery获得字体颜色16位码的方法

网页里控制图片大小的相关代码

jQuery Timelinr实现垂直水平时间轴插件(附源码下载)

鼠标图片振动代码

jquery实现用户打分评分特效

js实现异步循环实现代码

精品推荐
分类导航