jQuery：如何在类之间淡出？

我需要能够在类之间淡入淡出并无缝转换应用于元素及其子元素的任何和所有样式。 如何使用jQuery完成？ 我知道如何添加/删除类，但这与两种截然不同的颜色之间的良好过渡不同。

Answer 1

jQuery UI有一个toggleClass函数，它有一个持续时间的参数：

http://jqueryui.com/demos/toggleClass/

例如，我在我的一个网站上执行此操作（淡入/淡出淡出类并淡出/淡出dark类）：

 $('body').toggleClass('light', 250).toggleClass('dark', 250); 

Answer 2

这是你想要完成的吗？ 这是jsFiddle

HTML：

jQuery的：

 $("#toggle").click(function (){ if ($("#class1").is(":visible")) { $("#class1").fadeOut(); $("#class2").fadeIn(); } else { $("#class1").fadeIn(); $("#class2").fadeOut(); } }); 

CSS：

 #classContainer { position: relative; } #class1, #class2 { height: 100px; width: 100px; position: absolute; top: 0; left: 0; } #class1 { background-color: red; display: none; } #class2 { background-color: blue; } 

Answer 3

查看jQuery的颜色插件： https ： //github.com/jquery/jquery-color

Answer 4

尝试淡入淡出。

 $(".myClass").fadeIn("slow"); 

http://api.jquery.com/fadeIn/

虽然取决于复杂性，您可能需要jQuery UI，正如其他人所提到的那样。