麻烦与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

回答

相关问题