JQuery插件使用之JMp3 & JMedia Player

發布時間：2020-04-05 15:37:10 來源：網絡閱讀：1039 作者：轉身陌路欄目：web開發

項目接近尾聲了，現在各種測試和完善。因為需要在網站上播放視頻和音樂，就搜羅搜羅了一些播放插件。

最終確定的插件都是基于JQuery開發的，音樂插件JMp3(http://www.sean-o.com/jquery/jmp3/)

視頻插件JQuery Media(http://jquery.malsup.com/media/)

首先介紹如何使用JMp3。

1.在使用JMp3時，參考它的官網的描述，需要下載一個相關聯的輕量級的控件(Flash Single MP3 Player)。

2.需要下載JQuery，我使用的是JQuery1.7。推薦各位使用新版的JQuery

3.下載JMp3插件(在官網有下載鏈接)。

然后開始配置：

在html的Head中包括相關js文件:

<head>

</head>

配置相關參數:

        $(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>

默認播放音樂的文件名為sound.mp3。如果需要播放自定義的音樂文件，則需要在配置項中指定：

指定格式如下:

$(function(){
               $('#external').jmp3(function(){
                    file:"./"
                    backcolor:"ffd700",
                    forecolor:"8B4513",
                    width:300,
                    autoStart:"true",
                    repeatPlay:"true",
                    showdownload:"true"
               });
          });

自定義的音樂文件所在服務器文件夾。

加入自定義文件:

<span id="external" class="mp3">apologize.mp3</span></p> 將默認sound.mp3文件更改為:apologize.mp3

到此設置成功.

JMedia Player使用:

JMedia使用比較簡單，下載好插件。然后再相關html文件中引用，然后即可。格式如下:

js代碼:

$('.media').media();

html標簽:

<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>

     打開網頁就可以看到視頻播放了。

向AI問一下細節

中文字幕av专区_日韩电影在线播放_精品国产精品久久一区免费式_av在线免费观看网站

JQuery插件使用之JMp3 & JMedia Player

猜你喜歡

中文字幕av专区_日韩电影在线播放_精品国产精品久久一区免费式_av在线免费观看网站

JQuery插件使用之JMp3 & JMedia Player

猜你喜歡

最新資訊

相關推薦

相關標簽