javascript导航栏问题

[SummerKs]

我里面写了两个div
下面是 javascript语言
function show(div) {
document.getElementById(div).style.display = "";
}

function hide(div) {
document.getElementById(div).style.display = "none";
}


html：
<li onmouseover="show('div1');" onmouseout="hide('div1');">洞庭碧螺春</li>


我想做到效果（1）鼠标移动到“洞庭碧螺春” 下面的div层（下文取名showdiv）显示出来（这个我已经做到了）
（2）鼠标可以移动到showdiv（鼠标从“洞庭碧螺春”移动到showdiv的时候showdiv不消失）这点思考了我半天额。。。
（3）鼠标从“洞庭碧螺春”或showdiv移开的时候showdiv消失。

[idoiknow]

可以加一个鼠标是否在子菜单的标识变量，如果在的话不隐藏，原先的隐藏处理要延迟处理，避免隐藏函数在鼠标离开一级菜单还没去到二级菜单时就执行 var focusInDetailMenu=false; //标示鼠标位置在子菜单上 function hide(div) { setTimeout(function(){ if(!focusInDetailMenu) document.getElementById(div).style.display = "none"; },500); } 子菜单的元素的事件处理中，在鼠标进入时，将focusInDetailMenu变量置为true，鼠标离开时置为false 根据实际情况调整这个延迟的时间，500毫秒不一定适合你

[苹果没有皮]

<div class="all"> <碧螺春> <showDiv> </div> 让鼠标移到all的时候showDiv,移出的时候hiddenDiv

[hch126163]

var timer; function show(div) { if(timer){clearTimeout(timer);} document.getElementById(div).style.display = ""; } function hide(div) { timer=setTimeout(function(){document.getElementById(div).style.display = "none";},500); } div1 也设置： onmouseover="show('div1');" onmouseout="hide('div1');"

[linbooooo1987]

<div class="all"> <碧螺春> <showDiv> </div> html这样写。