2009-10-30 197 views
3

http://www.izrada-weba.com/orso 在鼠標懸停的鏈接「NENATKRIVENA TERASA ...」子菜單和圖像一起褪色。子菜單使用褪一些下載的腳本和圖像上面使用我的代碼正在消退:Jquery懸停淡入/淡出問題

$(document).ready(function() { 
    $("#slika1").hide(); 

    $("#test,#submenu2").hover(
     function() { 
     $("#slika1").fadeIn(); 
     }, 
     function() { 
     $("#slika1").fadeOut(); 
     } 
    );  
}); 

當鼠標移動到鏈接比圖片淡出的,而當鼠標移動到子菜單圖像淡出,比淡出再次.. 。我知道爲什麼是這樣,但我不知道如何讓它直接從鏈接移動到子菜單時不會消失。 有沒有解決方案?

謝謝, 島

回答

16

的功能停止()將停止指定的元素上的任何當前正在運行的動畫。
嘗試修改您的鼠標懸停功能:

$("#slika1").stop().fadeIn(); 


編輯:
似乎有與子菜單中的所有方式不褪色的問題(見ILE的評論)。這在我看來就像它的一個jQuery錯誤,但我不確定。也許有人可以插話並解釋爲什麼會發生這種情況。
爲了解決這個問題,使用fadeTo();它似乎產生期望的結果:

$(document).ready(function() { 
    $("#slika1").fadeTo(0,0); 

    $("#test,#submenu2").hover(
    function() { 
     $("#slika1").stop(true).fadeTo("normal",1); 
    }, 
    function() { 
     $("#slika1").fadeTo("normal",0); 
    } 
);  
}); 
+0

太棒了!謝謝,Jataro! –

+0

嗯,現在出現了新問題,當鼠標從鏈接快速移動到子菜單時,即使再次製作moseouver,圖像也不會100%褪色,然後圖像保持透明:/ –

+0

大感謝!你爲我節省了很多時間:) –

1

與當​​中斷fadeIn()不工作的問題是,因爲fadeIn()只能如果元素是隱藏的。無論你稱之爲錯誤還是功能。要解決這個問題,您可以執行以下操作。

$("#mydiv").stop().hide().fadeIn(450);