当前位置: 首页 > 编程笔记 >

js实现可兼容IE、FF、Chrome、Opera及Safari的音乐播放器

沃学
2023-03-14
本文向大家介绍js实现可兼容IE、FF、Chrome、Opera及Safari的音乐播放器,包括了js实现可兼容IE、FF、Chrome、Opera及Safari的音乐播放器的使用技巧和注意事项,需要的朋友参考一下

本文实例讲述了js实现可兼容IE、FF、Chrome、Opera及Safari的音乐播放器。分享给大家供大家参考。具体实现方法如下:

/** 音乐播放器 
* @param obj  播放器id 
* @param file  音频文件 mp3: ogg: 
* @param loop  是否循环 
*/ 
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'); // 停止 

希望本文所述对大家的javascript程序设计有所帮助。

 类似资料:
  • 本文向大家介绍js实现兼容IE和FF的上下层的移动,包括了js实现兼容IE和FF的上下层的移动的使用技巧和注意事项,需要的朋友参考一下 这里给大家分享的是项目中的一个小需求,本来很简单,可是整了好久才把FF的兼容性搞定。 以上所述就是本文的全部内容了,希望大家能够喜欢。

  • 本文向大家介绍js实现有过渡渐变效果的图片轮播相册(兼容IE,ff),包括了js实现有过渡渐变效果的图片轮播相册(兼容IE,ff)的使用技巧和注意事项,需要的朋友参考一下 本文实例介绍了js实现图片轮播相册,具有过渡渐变效果,分享给大家供大家参考,具体内容如下 思路很简单,用2个属性保存当前图片和上一张图片,用2个定时器分别控制透明度和当前过渡的图片。 以上就是本文的全部内容,希望对大家学习jav

  • 本文向大家介绍python实现音乐播放器 python实现花框音乐盒子,包括了python实现音乐播放器 python实现花框音乐盒子的使用技巧和注意事项,需要的朋友参考一下 本文实例为大家分享了python实现音乐播放器的具体代码,供大家参考,具体内容如下 以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持呐喊教程。

  • 本文向大家介绍兼容IE、firefox以及chrome的js获取时间(getFullYear),包括了兼容IE、firefox以及chrome的js获取时间(getFullYear)的使用技巧和注意事项,需要的朋友参考一下 一般情况下,我们获取年份的时候都是通过下面的代码: 以上代码在IE中initYear是对的,但是ff以及chrome下不兼容,换成 IE、FireFox、Chrome下均可行

  • 本文向大家介绍Python实现在线音乐播放器,包括了Python实现在线音乐播放器的使用技巧和注意事项,需要的朋友参考一下 最近这几天,学习了一下python,对于爬虫比较感兴趣,就做了一个简单的爬虫项目,使用Python的库Tkinsert做了一个界面,感觉这个库使用起来还是挺方便的,音乐的数据来自网易云音乐的一个接口,通过requests模块,get请求将数据获得,使用Json模块进行数据的解

  • 本文向大家介绍android实现简单音乐播放器,包括了android实现简单音乐播放器的使用技巧和注意事项,需要的朋友参考一下 本文实例为大家分享了android音乐播放器的具体代码,供大家参考,具体内容如下 话不多说先上效果 前言 写这个音乐播放器实在是迫不得已。因为我们Andoird课程要求写一个音乐播放器。所以就有了此项目。这个项目比较简单,实现了最基本的音乐播放功能,然后界面是仿照着网易云