音乐播放停止

长安start

已于 2022-05-24 11:18:55 修改

阅读量190

点赞数

分类专栏：前端 js 文章标签： HTML JavaScript 音频控制事件处理用户交互

于 2021-07-06 01:15:23 首次发布

本文链接：https://blog.csdn.net/godfather_001/article/details/118503295

版权

前端同时被 2 个专栏收录

15 篇文章 0 订阅

订阅专栏

12 篇文章 0 订阅

订阅专栏

音乐播放停止

<html>
  <body>
    <audio
      src="music.mp3"
      controls="controls"
      style="display: none"
      id="music_bg"
    ></audio>

    <div
      id="button_music"
      onclick="toggleSound()"
      style="
        width: 100px;
        height: 37px;
        background: url(open.jpg) no-repeat scroll 0 0;
      "
    ></div>

    <script>
      function toggleSound() {
        var music = document.getElementById("music_bg");
        var toggle = document.getElementById("button_music");
        if (music.paused) {
          music.play();
          toggle.innerHTML =
            "<div style='width:100px;height:37px; background: url(close.jpg) no-repeat scroll 0 0;'></div>";
        } else {
          music.pause();
          toggle.innerHTML =
            "<div style='width:100px;height:37px; background: url(open.jpg) no-repeat scroll 0 0;'></div>";
        }
      }

      
    </script>
  </body>
</html>