2012-02-09 20 views
3

我有一個使用jQuery來淡入當鼠標懸停在DIV一個非常簡單的股利。然後當鼠標離開div時,它會淡出。JQuery的淡入/輸出只工作一週時間

我的問題:淡入/淡出只能使用一次。當我把我的鼠標在DIV第二次它不褪色。

請告訴我去錯了嗎?的jsfiddle:http://jsfiddle.net/hWyUn/3/

<div id="test" style="opacity: 0; width: 100px; height: 100px; background-color: red;"> 
</div> 

$("#test").mouseenter(function() 
        { 
         $(this).css("opacity","1").fadeIn(); 
        }); 

$("#test").mouseleave(function() 
        { 
         $(this).fadeOut(); 
        }); 

回答

4

使用fadeTo爲我工作:

$("#test").mouseenter(function() 
    { 
     $(this).fadeTo("slow", 1); 
    }); 

$("#test").mouseleave(function() 
    { 
     $(this).fadeTo("slow", 0); 
    }); 

這裏:http://jsfiddle.net/hWyUn/4/

0

解決了您的問題。 退房的小提琴......

jsFiddle

0

你總是可以嘗試使用了jQuery的動畫以動畫的不透明度,而不是淡入和淡出。可能是較短的代碼。

動畫的透明度將不設置顯示爲無,所以它淡出後,您仍然可以擺弄它。

See my jsFiddle here

1

這將工作僅當元素是隱藏的。 您可以通過執行$(元素)的CSS設置元素的顯示爲none( '顯示', '無')之前$(元素).fadeIn():)