javascript鼠标移入移出事件
鼠标移入1级菜单后,弹出2级菜单,鼠标移出1级菜单后,2级菜单被隐藏——鼠标移入2级菜单后,显示2级菜单,鼠标移出2级菜单后,2级菜单被隐藏。求解决鼠标移出1级菜单,还没...
鼠标移入1级菜单后,弹出2级菜单,鼠标移出1级菜单后,2级菜单被隐藏——鼠标移入2级菜单后,显示2级菜单,鼠标移出2级菜单后,2级菜单被隐藏。求解决鼠标移出1级菜单,还没有移入2级菜单的情况下,2级菜单自动隐藏的问题。
展开
3个回答
展开全部
两种办法:2级菜单要紧挨着1级菜单,至少有一部分是相连的,这样鼠标沿着相连的部分移动,就不会让2级菜单自动隐藏了;或者在1级菜单的mouseout事件中,不要立刻让2级菜单隐藏,而是延迟一段时间再隐藏,比如 var t = setTimeout("2级菜单.style.display='none'",1000); ,这样的话,只要在1秒内鼠标移到2级菜单上即可,当然,2级菜单的mouseover事件要立刻执行 clearTimeout(t);。特别注意:变量t一定要设为全局的。
展开全部
你要鼠标移出后1级菜单后2级菜单隐藏,又要鼠标移出1级菜单后移入2菜单前不隐藏
但是你的一级菜单和二技菜单还不是连在一起 这个逻辑就本身有问题
要实现你说的内容 方法有两个
1、修改排版 把一级菜单和二技菜单连在一起
2、对”鼠标移出后1级菜单后2级菜单隐藏”这个操作进行延时处理,示例
<HTML>
<HEAD>
<style>
.menu1 {color:red;background:yellow;}
.menu2_hide {color:blue;display:none;}
.menu2_show {color:blue;background:red;}
</style>
</HEAD>
<BODY>
<span id='menu1' class='menu1'>menu1</span>
<span id='menu2' class='menu2_hide'>menu2</span>
<SCRIPT LANGUAGE="JavaScript">
<!--
var timer;
document.getElementById('menu1').onmouseover=function()
{
document.getElementById('menu2').className='menu2_show'
};
document.getElementById('menu1').onmouseout =function()
{
timer = setTimeout("document.getElementById('menu2').className='menu2_hide';",200);
};
document.getElementById('menu2').onmouseover=function()
{
clearTimeout(timer);
document.getElementById('menu2').className='menu2_show'
};
document.getElementById('menu2').onmouseout =function()
{
document.getElementById('menu2').className='menu2_hide'
};
//-->
</SCRIPT>
</BODY>
</HTML>
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
要么就hover的时候增加width来连接二级菜单
要么就二级菜单加个底层背景.大小可以接上一级菜单 不过只有右边可以离开二级菜单时隐藏了
或者做成点击事件.直接解决
要么就二级菜单加个底层背景.大小可以接上一级菜单 不过只有右边可以离开二级菜单时隐藏了
或者做成点击事件.直接解决
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询