如何判断当前鼠标是否在一个指定的元素上面？

snmhm1991 2012-04-25 02:34:33

具体的想法是这样：
我想做一个类似菜单的按钮，然后当鼠标移动到按钮上时会出现一个下拉菜单，然后如果当鼠标移动到菜单上时，这个菜单不会消息，然后如果要是当前鼠标既不在按钮上又不在菜单上时就会消失，所以我对当鼠标移动到按钮上后已经显示菜单后怎么判断鼠标是不是移动到了菜单上感到困惑，请大家帮忙下

...全文

799 4 打赏收藏转发到动态举报

写回复

用AI写文章

4 条回复

切换为时间正序

请发表友善的回复…

发表回复

wzhiyuan 2012-04-25

打赏
举报

主要就是延时，例如



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title></title>



 <style type="text/css" >

 .subs{display:none;width:200px; background-color:Gray;}

</style> 





</head>

<body>



<a id="item1" onmouseout="settimerhide()" onmouseover="itemover()" >menu</a>

 <div id="sub1" class="subs" onmouseout="settimerhide()" onmouseover="subsover()" >

 some sub text<br />

 some sub text<br />

 some sub text

  </div>

  

 <script type="text/javascript" >

     var timershow, timerhide;



     function itemover() {         

         if (timerhide) { window.clearInterval(timerhide); }

         if (document.getElementById("sub1").style.display != "block") {

             timershow = window.setTimeout("document.getElementById('sub1').style.display = 'block';", 200)

         }

     }



     function subsover() {

         if (timerhide) { window.clearInterval(timerhide); }     

      }

     

    



 function settimerhide() {

     timerhide = window.setTimeout("document.getElementById('sub1').style.display = 'none';", 200)

  }

 

 

     

 </script>

 

</body>

</html>

似梦飞花 2012-04-25

打赏
举报

hch126163 2012-04-25

打赏
举报

onmouseover
onmouseout
+ setTimeout

去圣西罗-为尤文喝彩 2012-04-25

打赏
举报

jquery 的
mouseover http://api.jquery.com/mouseover/
mouseleave http://api.jquery.com/mouseleave/

mouseenter http://api.jquery.com/mouseenter/
mouseout http://api.jquery.com/mouseout/

上面2组均可以。