zoukankan      html  css  js  c++  java
  • audio标签+JS实现音乐播放和暂停的功能

    此处以点击音乐图片sndctrl实现功能举例:

    HTML部分:

    <div class="sndctrl">
      <img class="homeLoadingImg" data-src="images/a01.png"><i></i>
      <audio id="audio" src="media/music.mp3" autoplay></audio>
    </div>

    JS部分:

    /*
    函数名称:music()
    功 能:播放背景音乐
    */
    function music() {
      var audio=document.getElementById("audio");
      var sndplay=false;
      $("html,body").one("touchstart",function(){
        sndplay=true;
        audio.play();
      });
      audio.addEventListener("ended",function(e){
        sndplay=true;
        audio.play();
      },false);
      $(".sndctrl").click(function(){
      if(sndplay){
        audio.pause();
        $(this).find("i").show();
       }else{
        audio.play();
        $(this).find("i").hide();
      }
        sndplay=!sndplay;
      });
    };

    最后记得在自己代码合适位置调用music()

  • 相关阅读:
    有没有用户体验+UI+前端集于一身的人
    ruby array.count
    ruby subset
    向李刚同学道歉
    rails3转载
    RVM and Capistrano
    paperclip自定制文件名
    ruby爬虫
    rails3已经内置subdomain
    摘录
  • 原文地址:https://www.cnblogs.com/Cloudloong/p/9562725.html
Copyright © 2011-2022 走看看