有关两个div间鼠标移动的问题?

有两个紧挨的层:div1和div2(默认隐藏):
当鼠标移动到div1上时:div2显示--当鼠标离开div1但同时移动到div2上时,div2依旧显示;--鼠标离开div2或者从div1上离开但是没有移动到div2上时则:div2隐藏;
说的比较费事,但是我想各位一看便明白小弟想要实现的功能是怎么样的了... 拜托各位了.

解决方案 »

  1.   

      <div id="dOne" onmouseover="document.getElementById('dTwo').style.display='block';" onmouseout="document.getElementById('dTwo').style.display='none';">divOne
      </div>
      <div id="dTwo" style="display:none;"  onmouseover="this.style.display='block';" onmouseout="this.style.display='none';">divTwo</div>笨方法。
      

  2.   

    谢谢楼上的兄弟,但是没有达到我想要实现的目的,你的方法会出现,鼠标移动到dTwo上时,dTwo也会显示;我想要实现的只有移动到dOne上时dTWo才显示;
      

  3.   

    dTwo默认是隐藏的，在没有移到dOne时，鼠标怎么能移到dTwo上？
      

  4.   

    呵呵 是我没注意 不好意思, 但是你的done的 out事件是在DTWO的over事件之前触发的, 嘿嘿.. 根本就不可能在触发DTWO的over事件了
      

  5.   

    那你去掉dTwo的onmouseover事件试下。
      

  6.   


    <%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %><!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 runat="server">
        <title>无标题页</title>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
        <div id="div1" style="position:absolute; background-color:Yellow ; width:50px; height:20px;" onmouseover="document.all.div2.style.display='' " onmouseout="document.all.div2.style.display='none' " >菜单1</div>
         <div id="div2" style="position:absolute; background-color:Red ; top:35px;  width:50px; display:none;" onmouseover="document.all.div2.style.display=''"  onmouseout="document.all.div2.style.display='none' "  >菜单2</div>
        </div>
        </form>
    </body>
    </html>