howler.js - 按钮淡入和淡出班级更改中的音乐答案

【问题标题】：howler.js - button fade in and fade out music in class changehowler.js - 按钮淡入和淡出班级更改中的音乐
【发布时间】：2014-06-12 12:16:54
【问题描述】：

您好，我需要有关 howler.js 的帮助 http://goldfirestudios.com/blog/104/howler.js-Modern-Web-Audio-Javascript-Library

我做网站，在这个网站上它是一个小图片

这个作品很好的音乐它是淡出的

$(function(){
sh_highlightDocument();

$('.ex2-fadein').on('click', function(){
    sound2.pause().fadeIn(0.5, 2000);
});
$('.ex2-fadeout').on('click', function(){
    sound2.fadeOut(0, 3700);
});

但是如果我点击淡入这个相同的图标，这是行不通的。

请告诉我如何更改此图标中的类

<div id="musicoffon" class="ex2-fadeout"><img src="images/music.png"></div>

到

 <div id="musicoffon" class="ex2-fadein"><img src="images/music.png"></div>

点击后？

感谢您的帮助。我真的搜索答案 6 小时 :(

【问题讨论】：

您可以提供jsFiddle 供我们调查吗？

标签： javascript jquery html css howler.js

【解决方案1】：

我认为您对自己的代码感到困惑。这很简单。您可以创建一个具有 opacity 属性的类，然后在单击 div“musicoffon”时切换该类。剩下的一个，你需要使用 jquery UI。

HTML：

<div id="musicoffon" class="ex2-fadeout"><img src="http://www.detailinggurus.com/images/sample_bottles.jpg"></div>

CSS：

 .ex2-fadein
{
 opacity:0.6;
}

JQUERY：

 $(document).ready(function(){
    $('#musicoffon').on('click', function(){
      $(this).toggleClass('ex2-fadein',500);
    });
});

Have a Fiddle

【讨论】：