添加和删​​除带动画的类

Question

我编写了一个脚本，可以在另一个框的悬停中更改框的颜色： http://jsfiddle.net/w5b9v/2/

如何为此过渡添加动画？ 提前致谢

Answer 1

你可以这样做http://jsfiddle.net/steweb/fn68L/

JS：

$(document).ready(function(){
$(".wrapper div.me:last").addClass("reduce");
  $(".wrapper div.me").hover(
  function(){
     $(this).fadeTo('fast',1); //or $(this).animate({opacity:1},300/*ms*/)
     $(".wrapper div").not(this).fadeTo('fast',0.8);
  }); 
});

或者您可以查看Animate to Class jquery插件;）

Answer 2

jQuery .animate方法主要为数字属性设置动画，但不包括添加减去类的内容。

如果您只想更改不透明度，可以使用.fadeTo。

$(".wrapper div").not(this).fadeTo('slow', 0.5);

以上会将不透明度降低一半。

This question提供了更多信息，包括jQueryUI switchClass方法。这个问题也暗示了.animateToSelector插件。

最后有animateToClass，但这似乎只是将.animate的功能包装到一个类中，这意味着你的一些非数字值将无效。