·您当前的位置:首页 > 技术教程 > 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> 

 

热门文章推荐

请稍候...

保利威视云平台-轻松实现点播直播视频应用

酷播云数据统计分析跨平台播放器