在鼠標懸停時自動顯示div

這可能是我遇到的一個簡單問題，但對於我的生活，我似乎無法弄清楚。如果你們中的任何人都可以幫助我，我會非常感激。在鼠標懸停時自動顯示div

我使用JQuery使用戶懸停在某個div上時出現一個菜單。該菜單將顯示在div的左上角。我得到了這個工作，但當我嘗試點擊出現的div的菜單項時，div再次消失，因爲鼠標技術上不在div上，而是在菜單上。

在下面的示例中，「#blockMenu」是動態顯示的菜單。我淡化當前div（$ this））一點點，以強調菜單。

我使用下面的代碼來實現這一目標：

$("div.editable").hover(function() { 
    $(this).fadeTo(500, 0.25); 
    $('#Menu').css("position", "absolute"); 
    $("#Menu").css("top", $(this).offset().top); 
    $("#Menu").css("left", $(this).offset().left); 
    $("#Menu").css("zIndex", "10000"); 
    $('#Menu').show(); 
}, function (e) { // on mouseout 
    $(this).fadeTo(500, 1); 
    $("#Menu").hide(); 
});

我希望菜單當光標離開DIV消失，而在div仍淡出當光標是在菜單上。當光標同時離開菜單和div時，div應該淡入，菜單應該消失。

有沒有人有我如何編輯我的代碼，使其正確工作的想法？

非常感謝您給我的任何幫助。

來源

2011-07-09 Steven Lemmens

我可以看看在HTML請 –

哦，對於古德尼斯的緣故，使用對象文字來設置樣式... –

使菜單是div的孩子，它會起作用。 –