JQuery插件使用之JMp3&JMediaPlayer
項(xiàng)目接近尾聲了，現(xiàn)在各種測(cè)試和完善。因?yàn)樾枰诰W(wǎng)站上播放視頻和音樂，就搜羅搜羅了一些播放插件。
最終確定的插件都是基于JQuery開發(fā)的，音樂插件JMp3(http://www.sean-o.com/jquery/jmp3/)
視頻插件JQuery Media(http://jquery.malsup.com/media/)
首先介紹如何使用JMp3。
1.在使用JMp3時(shí)，參考它的官網(wǎng)的描述，需要下載一個(gè)相關(guān)聯(lián)的輕量級(jí)的控件(Flash Single MP3 Player)。
2.需要下載JQuery，我使用的是JQuery1.7。推薦各位使用新版的JQuery
3.下載JMp3插件(在官網(wǎng)有下載鏈接)。
然后開始配置：
在html的Head中包括相關(guān)js文件:
<head>
<script type="text/javascript" src="/js/jquery/jquery.js"></script>
<script type="text/javascript" src="/js/jquery/jmp3/jquery.jmp3.js"></script>
</head>
配置相關(guān)參數(shù):
<script type="text/javascript">
$(document).ready(function(){
// default options
$(".mp3").jmp3();
// custom options
$("#mysong").jmp3({
backcolor: "000000",
forecolor: "00ff00",
width: 200,
showdownload: "true"
});
});
</script>
然后在html頁面中需要插入控件的代碼:
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="150" height="20"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab"><param name="movie" value="singlemp3player.swf?showDownload=false" />
<param name="wmode" value="transparent" />
<embed wmode="transparent" width="150" height="20" src="singlemp3player.swf?showDownload=false"
type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
默認(rèn)播放音樂的文件名為sound.mp3。如果需要播放自定義的音樂文件，則需要在配置項(xiàng)中指定：
指定格式如下:
$(function(){
$('#external').jmp3(function(){
file:"./"
backcolor:"ffd700",
forecolor:"8B4513",
width:300,
autoStart:"true",
repeatPlay:"true",
showdownload:"true"
});
});
$('#external').jmp3(function(){
file:"./"
backcolor:"ffd700",
forecolor:"8B4513",
width:300,
autoStart:"true",
repeatPlay:"true",
showdownload:"true"
});
});
自定義的音樂文件所在服務(wù)器文件夾。
加入自定義文件:
<span id="external" class="mp3">apologize.mp3</span></p> 將默認(rèn)sound.mp3文件更改為:apologize.mp3
到此設(shè)置成功.
JMedia Player使用:
JMedia使用比較簡單，下載好插件。然后再相關(guān)html文件中引用，然后即可。格式如下:
js代碼:
$('.media').media();
html標(biāo)簽:
<a class="media" href="sample.mov">My Quicktime Movie</a>
<a class="media" href="sample.swf">My Flash Movie</a>
<a class="media" href="sample.wma">My Audio File</a>
打開網(wǎng)頁就可以看到視頻播放了。
本文名稱：JQuery插件使用之JMp3&JMediaPlayer
URL標(biāo)題：http://www.rwnh.cn/article16/psjcgg.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站導(dǎo)航、定制網(wǎng)站、網(wǎng)站排名、App設(shè)計(jì)、軟件開發(fā)、網(wǎng)站制作
聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)
