Question

这是我的标题：

我想两次添加声音效果：

on mouseover on a href from（innerlinks）
点击（内部链接）的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>

Answer 1

您可以在页面上添加几个音频标签，并按照本文所述进行播放 - Play Sound on :hover | CSS-Tricks。

<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>

Answer 2

需要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();
    });

Demos at CSS Tricks

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

2 个答案: