jQuery從一個類到另一個褪色元素，在懸停

例如。

.class1{ 
    background-image:(whatever.jpg) 
    color: #fff; 
} 

.class2{ 
    background-image:(whatever2.jpg) 
    color: #999; 
}

我可以淡化有class1的類class2當鼠標移動到元素中的所有元素，並返回到Class當鼠標離開？

來源

2011-02-07 Alex

如果你給兩個相同的絕對位置，使用淡入（）和淡出（）都會有這樣的效果（附着的onmouseover和onmouseout）。

來源

2011-02-07 10:11:35 drewblaisdell

我認爲this plugin是你在找什麼。它允許你在類之間進行動畫處理。例如：

$('.class1').animateToClass('.class2', 1000);

來源

2011-02-07 10:11:17 Olical

+1這也是我對問題的理解。請注意，對於彩色動畫，您需要使用jQuery UI或像http://plugins.jquery.com/project/color – sunn0 2011-02-07 10:17:00

+1這樣的插件。我認爲jQuery可以動畫顏色。 – Olical 2011-02-07 10:19:09

似乎不適合我 – Alex 2011-02-07 10:44:18

看一看jQuery UI's extension to addClass。它允許持續時間參數給出動畫的可能性。

在這裏，我想你想要做這樣的事情：

$('.class1').hover(function(){ 
    $(this).addClass('class2', 800); 
}, function(){ 
    $(this).removeClass('class2', 800); 
});

顯然，你需要安裝jQuery UI的這一點。

來源

2011-02-07 10:14:10 lonesomeday

-2

我認爲這可能是幫助全給你....

$('.class1').mouseover(function() { 
    $(this).toggleClass('class2'); 
});

來源

2011-02-07 10:18:31 Vivek

如果你不想使用插件，你可以做到以下幾點：

$(".class1").hover(
function() { 
    $(this).fadeOut(function() { 
     $(this).removeClass("class1").addClass("class2").fadeIn('fast'); 
    }); 
}, 
function() { 
    $(this).fadeOut(function() { 
     $(this).removeClass("class2").addClass("class1").fadeIn('fast'); 
    }); 
});

來源

2011-02-07 10:20:14

這是我的執行：

 $(this).fadeOut("fast"); or $(this).hide(); 
     $(this).removeClass('css1').addClass('css2'); 
$(this).fadeIn("slow");

來源

2012-03-02 16:04:25 Victor

jQuery從一個類到另一個褪色元素，在懸停

回答

相關問題