麻煩與onmouseout - 簡單的下拉菜單Javascript

我有一個表與1 td和我附上onmouseover事件處理程序，它將div的dispay屬性從「無」改變爲「塊」，我認爲做同樣的事情與div - 附加處理程序onmouseout事件只是簡單地將顯示改回「無」將做到這一點。不幸的是，當我將光標從td下移到div時，div接近div邊框時消失。什麼問題？這裏是非常簡單的代碼示例：麻煩與onmouseout - 簡單的下拉菜單Javascript

<table> 
<tr> 
     <td onmouseover="showMenu()" >BLOCK ONE</td> 
    <td>BLOCK TWO</td> 
</tr> 
</table> 

<div id="box1" onmouseout="hideMenu()"> 
    <a href="www.abv.bg">www.abv.bg</a><br> 
    <a href="www.abv.bg">www.abv.bg</a><br> 
    <a href="www.abv.bg">www.abv.bg</a><br> 
    <a href="www.abv.bg">www.abv.bg</a><br> 
    <a href="www.abv.bg">www.abv.bg</a><br> 
    <a href="www.abv.bg">www.abv.bg</a><br> 
    <a href="www.abv.bg">www.abv.bg</a><br> 

</div>

的JavaScript：

function showMenu() { 
var div = document.getElementById('box1'); 
div.style.display = 'block'; 

} 

function hideMenu() { 
var div = document.getElementById('box1'); 
div.style.display = 'none'; 

}

來源

2011-11-24 EnTrERy

爲什麼選擇「java」標記？你的問題與Java編程語言有什麼關係？我已經刪除了這個標籤;你會想要了解其中的差異。 –

我知道區別 – EnTrERy

@EnTrERy然後不要用它來標記它，這與Java完全沒有關係。 – FreeSnow

該上的可能會在您跳過A時觸發。

您可以將onmouseover="showMenu()"添加到DIV

來源

2011-11-24 14:38:06 Mic

這是做的伎倆，但也有一些副作用.. – EnTrERy

也許你可以從各種可用的工具提示插件之一獲得靈感。他們試圖做類似的事情。 – Mic

在這裏，你走了，帶着它擺弄了一下（在的jsfiddle）後，我來到這個解決方案爲您提供：

showMenu = function() { 
    var div = document.getElementById('box1'); 
    div.style.display = 'block'; 
} 

hideMenu = function() { 
    var div = document.getElementById('box1'); 
    div.style.display = 'none'; 
}

這是在jsFiddle中的現場演示：http://jsfiddle.net/KBry6/1/

來源

2011-11-24 14:03:49 FreeSnow

不能問題是，當光標命中子元素（在這種情況下，一些鏈接）時觸發onmouseout如何解決？ – EnTrERy

@EnTrERy那麼，你的代碼沒有工作開始。 – FreeSnow

麻煩與onmouseout - 簡單的下拉菜單Javascript

回答

相關問題