·您当前的位置:主页 > 技术教程 > Html5技术 >

[html5]html5音乐控制关闭开启源代码

时间:2016-07-11 14:36酷播
[html5]html5音乐控制关闭开启源代码

[html5]html5音乐控制关闭开启源代码

  1. <audio id="music2" src="music.mp3"  loop="loop">你的浏览器不支持audio标签。</audio> 
  2.         <a href="javascript:playPause();"><img src="pause.gif" width="48" height="50" id="music_btn2" border="0"></a> 
  1. <script type="text/javascript" src="http://libs.useso.com/js/jquery/1.7.2/jquery.min.js"></script><script> 
  2. $("#audio_btn").click(function(){ 
  3.     var music = document.getElementById("music"); 
  4.     if(music.paused){ 
  5.         music.play(); 
  6.         $("#music_btn").attr("src","play.gif"); 
  7.     }else{ 
  8.         music.pause(); 
  9.         $("#music_btn").attr("src","pause.gif"); 
  10.     } 
  11. }); 
  12.  
  13. function playPause() { 
  14.     var music = document.getElementById('music2'); 
  15.     var music_btn = document.getElementById('music_btn2'); 
  16.     if (music.paused){ 
  17.         music.play(); 
  18.         music_btn.src = 'play.gif'
  19.     } 
  20.     else{ 
  21.         music.pause(); 
  22.         music_btn.src = 'pause.gif';  
  23.     } 
  24. </script> 

 

热门文章

请稍候...
  • 锁定云视频大聚惠
  • 相约直播超值狂欢
保利威视云直播
保利威视云视频
微信付费直播
酷播云免费在线视频整体解决方案
酷播v4.0网页播放器