js實(shí)現(xiàn)可兼容IE、FF、Chrome、Opera及Safari的音樂(lè)播放器
本文實(shí)例講述了js實(shí)現(xiàn)可兼容IE、FF、Chrome、Opera及Safari的音樂(lè)播放器。分享給大家供大家參考。具體實(shí)現(xiàn)方法如下:
/** 音樂(lè)播放器
* @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音樂(lè)播放器
- 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)帶播放列表的音樂(lè)播放器實(shí)例分享
- 比較炫的圖片播放器 js 焦點(diǎn)效果代碼
- JavaScript實(shí)現(xiàn)簡(jiǎn)單音樂(lè)播放器
- JavaScript實(shí)現(xiàn)簡(jiǎn)單的音樂(lè)播放器
相關(guān)文章
JavaScript設(shè)置IFrame高度自適應(yīng)(兼容各主流瀏覽器)
IFrame高度的設(shè)置問(wèn)題一直都是前端的噩夢(mèng)而且還要兼容各主流瀏覽器更是難上加難了,下面與大家分享下一個(gè)不錯(cuò)的技巧,感興趣的你可以參考下哈2013-06-06
詳解微信小程序自定義組件的實(shí)現(xiàn)及數(shù)據(jù)交互
這篇文章主要介紹了微信小程序自定義組件的實(shí)現(xiàn)及數(shù)據(jù)交互,本文給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-07-07
javascript 折半查找字符在數(shù)組中的位置(有序列表)
折半查找字符在數(shù)組中的位置(有序列表),需要的朋友可以參考下。2010-12-12
IE6-8中Date不支持toISOString的修復(fù)方法
這篇文章主要介紹了IE6-8中Date不支持toISOString的修復(fù)方法,需要的朋友可以參考下2014-05-05
JS,Jquery獲取select,dropdownlist,checkbox下拉列表框的值(示例代碼)
本篇文章主要是對(duì)JS,Jquery獲取select,dropdownlist,checkbox下拉列表框的值(示例代碼)進(jìn)行了介紹,需要的朋友可以過(guò)來(lái)參考下,希望對(duì)大家有所幫助2014-01-01
基于JavaScript實(shí)現(xiàn)文件共享型網(wǎng)站
Any?Share?是一種簡(jiǎn)單、輕量、快速的文件共享服務(wù)。使用?Javascript?編寫(xiě),并搭建在?Firebase?平臺(tái)。本文將利用它實(shí)現(xiàn)創(chuàng)建文件共享型網(wǎng)站,感興趣的可以了解一下2022-11-11
關(guān)于js函數(shù)解釋(包括內(nèi)嵌,對(duì)象等)
下面小編就為大家?guī)?lái)一篇關(guān)于js函數(shù)解釋(包括內(nèi)嵌,對(duì)象等) 。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-11-11

