如何在a href点击和鼠标悬停上播放声音

how to play sound on a href click and mouseover

本文关键字:鼠标 悬停 播放声音 href      更新时间:2023-09-26

这是我的头:

我想添加两次声音效果:

  1. 在来自(innerlinks)的href上的鼠标悬停上
  2. 点击href(内部链接)
    我想要一个不同的声音onclick和onmouseover
    什么是最好的方法

谢谢!

<div id="HoverHeader">
    <div id="SiteHeader">
        <div id="MainNav">
           <div id="btnNav"><img src="../../../000Frames/site/images/menu-bt.png" alt="menu"/></div>
           <uc1:mainNav ID="mainNav1" runat="server" />
            <a href="../../../home/a/main" id="logo"></a>
            <div id="InnerLinks">
                <a href="../../../company/a/portfolio" id="portfolioLink">תיק עבודות</a>
                <a href="../../../company/a/customers" id="customersLink">לקוחותינו</a>
                <a href="../../../company/a/about/?ContentID=245" id="aboutLink">אודותנו</a>
                <a href="../../../company/a/contact" id="contactLink">צור קשר</a>
            </div>
        </div>
    </div>
</div>

您可以在页面上添加几个音频标签,并按照本文中的描述播放它们-在悬停| CSS技巧上播放声音。

<audio>
    <source src="audio/beep.mp3"></source>
    <source src="audio/beep.ogg"></source>
    Your browser isn't invited for super fun audio time.
</audio>
<script>
    var audio = $("#mySoundClip")[0];
    $("nav a").mouseenter(function() {
      audio.play();
    });
</script>

这需要JavaScript和一个音频标记。这是来自http://css-tricks.com/play-sound-on-hover/
悬停声音:

<audio id="hover">
    <source src="audio/hover.mp3"></source>
    <source src="audio/hover.ogg"></source>
    Your browser isn't invited for super fun audio time.
</audio>
var hover = $("#hover")[0];
$(".InnerLinks a").mouseenter(function() {
  hover.play();
});

点击声音:

<audio id="click">
   <source src="audio/click.mp3"></source>
   <source src="audio/click.ogg"></source>
   Your browser isn't invited for super fun audio time.
</audio>
    var click = $("#click")[0];
    $(".InnerLinks a").click(function() {
      click.play();
    });

CSS技巧演示