Question

我无法让这个jQuery工作。我正在尝试切换覆盖div的可见性。有五个div，一个有'on'类，页面加载，而其余的类'off'。但是，当代码执行时，“on”div淡出，但是应该接收“on”类的div不会出现。有什么问题？

.on{opacity:1;}
.off{opacity:0;)

$('li.tunes').click(
    function() { 
    $('div.on').animate({"opacity":"0"},800).removeClass('on').addClass('off', function()     {
$('div.tunesdiv').removeClass('off').addClass('on')
})
});

Answer 1

你的语法非常糟糕，你错过了几个分号。尝试更像：

$('li.tunes').click(function(){
  $('div.on').animate({"opacity":"0"},800).removeClass('on').addClass('off', function(){
    $('div.tunesdiv').removeClass('off').addClass('on');
  });
});

此外，如果您提供源代码，那将是很好的。

Answer 2

addClass中的第二个函数参数对我来说似乎完全错误，你需要在animate函数中使用一个处理程序。

这是我推荐的代码（.fadeTo（）为不透明度设置动画，这里更具可读性）

试试这个：

也因为fadeTo（）会为你的元素提供显式样式，你需要忘记样式表并让你的脚本排除不透明度：

$('li.off').fadeTo(1, 0);
$('li.on').fadeTo(1, 1);
$('li.tunes').click(function() { 
    $('div.on').fadeTo(800, 0, function() {
         $(this).removeClass('on').addClass('off');
         $('div.tunesdiv').fadeTo(1, 1).addClass("on").removeClass("off");
       });
});

Answer 3

您可以使用jQuery的fadeIn（ref）和fadeOut（ref）来设置不透明度的动画。
将该任务交给jQuery还可以帮助您支持不支持opacity CSS属性的旧版IE。

jQuery div opacity管理

3 个答案: