2011-09-19 83 views
0

堅持與我,我正在處理預先存在的代碼,並試圖不必檢修代碼。jQuery延遲無效果?

我正在處理需要延遲500毫秒彈出窗口的翻轉彈出式菜單。在瘋狂的CSS黑客做過這樣:

#nav ul li ul { 
    left: -9999999px; 
} 

#nav ul :hover ul { 
    left: auto; 
} 

<div id="nav"> 
    <ul> 
    <li>Link here</li> 
    <ul>Some popup content</ul> 
    </ul> 
</div> 

所以我殺了「#nav UL:懸停UL」 CSS定義和jQuery的

$("#nav ul li").live("mouseover", function() {$(this).children("ul").css("left", "auto"); return false}) 

看齊的原代碼寫了一個基本的班輪本質上,除了現在在JS控制

於是我在邏輯上,添加延遲,開始的setTimeout

$("#nav ul li").live("mouseover", function() {setTimeout(function() {$(this).children("ul").css("left", "auto");} return false}, 500)) 
亂搞

另外還有很多其他組合。通過setTimeout發送$(this)似乎是一個痛苦的屁股。我試着研究.delay(),但它似乎只適用於效果隊列,而且我不確定如何將效果隊列整合到該效果隊列中以使所有內容看起來不錯。所以任何幫助,將不勝感激

+0

您沒有爲setTimeout()設置超時期限。 setTimeout有兩個參數,一個函數或一個語句和一個時間(以毫秒爲單位) –

+0

對不起,我有它,只是忘了它在帖子中,將編輯 –

+0

你會注意到你的代碼仍然沒有正確設置。你的花括號不匹配。看看我在下面發佈的代碼。 –

回答

1

看到這個jsfiddle。

http://jsfiddle.net/wHBK8/1/

我不得不使用顯示:無,而不是左方法的的jsfiddle因爲它將不適左側。

另外,你的內部ul不在css中指定的li內。

這裏是如何將鼠標懸停中引用的這個參數傳遞給setTimeout。

$("#nav ul li").live("mouseover", function() { 
    var that= $(this); 
    setTimeout(function() {that.children("ul").show();}, 5000); 
    return false; 
}); 
1

爲什麼不使用.hoverIntent()

+0

這會工作,但我必須在Chrome中的JS控制檯中進行測試,所以插件很難通過測試。我會進一步研究那一個,但是,它看起來確實會幫助我們走下去 –