js實(shí)現(xiàn)可兼容IE、FF、Chrome、Opera及Safari的音樂播放器
本文實(shí)例講述了js實(shí)現(xiàn)可兼容IE、FF、Chrome、Opera及Safari的音樂播放器。分享給大家供大家參考。具體實(shí)現(xiàn)方法如下:
/** 音樂播放器
* @param obj 播放器id
* @param file 音頻文件 mp3: ogg:
* @param loop 是否循環(huán)
*/
function audioplayer(id, file, loop){
var audioplayer = document.getElementById(id);
if(audioplayer!=null){
document.body.removeChild(audioplayer);
}
if(typeof(file)!='undefined'){
if(navigator.userAgent.indexOf("MSIE")>0){// IE
var player = document.createElement('bgsound');
player.id = id;
player.src = file['mp3'];
player.setAttribute('autostart', 'true');
if(loop){
player.setAttribute('loop', 'infinite');
}
document.body.appendChild(player);
}else{ // Other FF Chome Safari Opera
var player = document.createElement('audio');
player.id = id;
player.setAttribute('autoplay','autoplay');
if(loop){
player.setAttribute('loop','loop');
}
document.body.appendChild(player);
var mp3 = document.createElement('source');
mp3.src = file['mp3'];
mp3.type= 'audio/mpeg';
player.appendChild(mp3);
var ogg = document.createElement('source');
ogg.src = file['ogg'];
ogg.type= 'audio/ogg';
player.appendChild(ogg);
}
}
}
用法示例:
var file = [];
file['mp3'] = '1.mp3';
file['ogg'] = '1.ogg';
audioplayer('audioplane', file, true); // 播放
audioplayer('audioplane'); // 停止
希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。
- (jsp/html)網(wǎng)頁(yè)上嵌入播放器(常用播放器代碼整理)
- 運(yùn)用js教你輕松制作html音樂播放器
- js實(shí)現(xiàn)的萬(wàn)能flv網(wǎng)頁(yè)播放器代碼
- Js視頻播放器插件Video.js使用方法詳解
- javascript實(shí)現(xiàn)簡(jiǎn)單的html5視頻播放器
- javascript 播放器 控制
- JavaScript實(shí)現(xiàn)帶播放列表的音樂播放器實(shí)例分享
- 比較炫的圖片播放器 js 焦點(diǎn)效果代碼
- JavaScript實(shí)現(xiàn)簡(jiǎn)單音樂播放器
- JavaScript實(shí)現(xiàn)簡(jiǎn)單的音樂播放器
相關(guān)文章
基于iframe實(shí)現(xiàn)類似于ajax的頁(yè)面無刷新
本方法是基于iframe實(shí)現(xiàn)的,需求是form表單提交帶有文件上傳的input標(biāo)簽,示例如下,感興趣的朋友可以參考下2014-05-05
javascript對(duì)select標(biāo)簽的控制(option選項(xiàng)/select)
html中的select標(biāo)簽,也是asp.net中的asp:DropDownList控件,接下來介紹javascript對(duì)select標(biāo)簽的控制,感興趣的朋友可以了解下,或許本文對(duì)你有所幫助2013-01-01
JavaScript 聯(lián)動(dòng)的無限級(jí)封裝類,數(shù)據(jù)采用非Ajax方式,隨意添加聯(lián)動(dòng)
JavaScript 聯(lián)動(dòng)的無限級(jí)封裝類,數(shù)據(jù)采用非Ajax方式,隨意添加聯(lián)動(dòng)2010-06-06
JS實(shí)現(xiàn)table表格固定表頭且表頭隨橫向滾動(dòng)而滾動(dòng)
這篇文章主要介紹了JS實(shí)現(xiàn)table表格固定表頭且表頭可以隨橫向滾動(dòng)而滾動(dòng),需要的朋友可以參考下2017-10-10
史上最全JavaScript數(shù)組去重的十種方法(推薦)
這篇文章主要介紹了JavaScript數(shù)組去重的十種方法,利用元素的屬性和特性進(jìn)行不同的去重方法,并實(shí)例演示如何測(cè)試去重超大數(shù)組,具體操作步驟大家可查看下文的詳細(xì)講解,感興趣的小伙伴們可以參考一下。2017-08-08
淺析JSONP技術(shù)原理及實(shí)現(xiàn)
這篇文章主要介紹了淺析JSONP技術(shù)原理及實(shí)現(xiàn) 的相關(guān)資料,非常不錯(cuò)具有參考借鑒價(jià)值,需要的朋友可以參考下2016-06-06
JavaScript調(diào)試常見報(bào)錯(cuò)及原因分析
這篇文章主要介紹了JavaScript調(diào)試常見報(bào)錯(cuò)及原因分析,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2023-04-04

