增加背景音乐静音按钮

Question

是的，我知道自动播放的背景音乐绝对是最糟糕的，但尽管我们恳求并试图阻止客户在他的网站上放这个，但他不会让步。归根结底，这是他想要的(也就是没有业务)。

所以不管怎样，我用下面的代码添加了背景音乐。它会自动在打开页面上播放，但是我想添加一个静音图标，以便人们能够关闭它。我不需要任何其他功能，只需要静音。我尽量避免使用闪光灯，但如果可能的话，我愿意使用jQuery。我不认为有CSS方法。

我已经用谷歌搜索过了，找不到我真正需要的任何东西，而且我也没有音乐和网站方面的经验，所以任何帮助都将不胜感激。

<embed name="lostmojo" src="music/atlast.mp3" loop="false" hidden="true" autostart="true">

Answer 1

首先，您可以使用音频标签而不是embed。您可以在音频标签上使用pause方法。

<audio id="lostmojo" autoplay="autoplay">
    <source src="annoyingsound.mp3" type="audio/mp3">
</audio>

<img src="mute.jpg" onclick="document.getElementById('lostmojo').pause()" />

这一次它应该可以工作了;)

Answer 2

使用Jquery:给音频元素一个id (例如"lostmojo")：

<embed name="lostmojo" id="lostmojo" src="music/atlast.mp3" loop="false" hidden="true" autostart="true">

之后，使用id为静音按钮定义一个img标记：

<img src="image.jpg" id="mute"/>

然后使用JQuery：

$("#mute").click(function() {$("#lostmojo").pause();});

Answer 3

<audio id="lostmojo" autoplay="autoplay">
    <source src="annoyingsound.mp3" type="audio/mp3">
</audio>

<img src="mute.jpg" onclick="document.getElementById('lostmojo').pause()" />

将mp3更改为mpeg。确保你有这些图像和声音。如果Doesent工作人员尝试删除源结尾处.mp3

<audio id="lostmojo" autoplay="autoplay">
    <source src="annoyingsound" type="audio/mpeg">
</audio>

<img src="mute.jpg" onclick="document.getElementById('lostmojo').pause()" />