我有一个< td>.它有一个应用的类,它指定一个背景颜色.我可以淡入一个不同的类,只有不同的背景颜色？就像是：
// css
.class1 {
background-color: red;
}
.class2 {
background-color: green;
}
$('#mytd').addClass('green'); // <- animate this?
谢谢
解决方法
你可以把一个克隆放在它的顶部,淡出原来的时候,同时褪色克隆.
褪色完成后,您可以切换回原始元素…确保在淡入淡出的回调中执行此操作！
下面的示例代码将在每次点击之间的两个类之间保持渐弱：
$(function(){
var $mytd = $('#mytd'),$elie = $mytd.clone(),os = $mytd.offset();
// Create clone w other bg and position it on original
$elie.toggleClass("class1,class2").appendTo("body")
.offset({top: os.top,left: os.left}).hide();
$("input").click(function() {
// Fade original
$mytd.fadeOut(3000,function() {
$mytd.toggleClass("class1,class2").show();
$elie.toggleClass("class1,class2").hide();
});
// Show clone at same time
$elie.fadeIn(3000);
});
});
jsFiddle example
.toggleClass().offset().fadeIn().fadeOut()