详细教程使用jQuery jPlayer插件给你的站点增加视频和音频功能.pdfVIP

详细教程使用jQueryjPlayer插件给你的站点增加视频和音频功能 这篇文章将主要探计关于怎么增加自定义视频和语音播放功能在你的WEB网站里面。这个是 一个非常好的jQuery新插件(jPlayer)， 包括很多功能 : 它允许你播放多媒体文件, 暂 停，音量调整，它拥有视频和音频播放功能会用到的所有功能控掉，同样他允许你改变它的 所有样式(styles),因为他的全部外观都是在一个css文件 里面。另外，它同样支持HTML5 和支持所有主流的浏览器。它目前支持的格式有: mp3, ogg, m4a, m4v, ogv, wav等等。 简短的介绍以后，我们开始详细编码过程: 1. HTML 首先开始HTML部件 1 link rel=stylesheet href=css/jplayer.blue.monday.css type=text/css media=all / 2 link rel=stylesheet href=css/main.css type=text/css media=all / 3 script src=js/jquery.min.js type=text/javascript/script 4 script src=js/jquery.jplayer.min.js type=text/javascript/script 5 script src=js/main.js type=text/javascript/script 6 div class=example 7 div 8 div class=players 9 h2Audio player/h2 10 div class=jp-audio 11 div class=jp-type-single 12 div id=jquery_jplayer_1 class=jp-jplayer/div 13 div id=jp_interface_1 class=jp-interface 14 ul class=jp-controls 15 lia href=# class=jp-play tabindex=1play/a/li 16 lia href=# class=jp-pause tabindex=1pause/a/li 17 lia href=# class=jp-stop tabindex=1stop/a/li 18 lia href=# class=jp-mute tabindex=1mute/a/li 19 lia href=# class=jp-unmute tabindex=1unmute/a/li 20 /ul 21 div class=jp-progress 22 div class=jp-seek-bar 23 div class=jp-play-bar/div 24 /div 25 /div 26 div class=jp-volume-bar 27 div class=jp-volume-bar-value/div 28 /div 29