jquery html5 視頻播放控制代碼
更新時間:2016年11月06日 18:11:38 投稿:mdxy-dxy
這篇文章主要介紹了jquery html5 視頻播放控制代碼,需要的朋友可以參考下
jQuery HTML5 視頻播放控制核心代碼:
<video class="pause" 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>
如果想正式用戶播放環(huán)境,建議大家使用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://m.fzitv.net/jiaoben/32245.html
jPlayer是一個JavaScript寫的完全免費和開源 (MIT) 的jQuery多媒體庫插件 (現(xiàn)在也是一個Zepto插件) jPlayer可以讓你迅速編寫一個跨平臺的支持音頻和視頻播放的網(wǎng)頁. jPlayer的豐富API可以讓你創(chuàng)建一個個性化多媒體應用,因此也獲得越來越多的社區(qū)成員的支持和鼓勵。
相關文章
ASP.NET MVC中EasyUI的datagrid跨域調用實現(xiàn)代碼
因為easyUI使用的是JQuery的異步方法加載數(shù)據(jù),應該遵循JQuery的跨域訪問規(guī)則2012-03-03
使用jQuery設置disabled屬性與移除disabled屬性
Readonly只針對input和textarea有效,而disabled對于所有的表單元素都有效,下面為大家介紹下使用jQuery設置disabled屬性2014-08-08

