多个div嵌套时onmouseover和onmouseout事情乱了

页面代码如下：网上有人说把两个事件换成onmouseenter和onmouseleave经测试IE行了。。但不兼容其它如火狐浏览器！
希望能解决兼容性。。 <!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript">
function mouseOver()
{
alert("经过");
}
function mouseOut()
{
alert("离开");
}    </script>
</head><body>
        
        <div id="aa" style="width:214px; height:124px;border:1px #0033CC solid;"onmouseover="mouseOver()" onmouseout="mouseOut()">
        <div id="aleft" style="width:92px; height:120px;border:1px #0033CC solid; float:left;"></div>
        <div id="aright" style="width:112px; height:120px;border:1px #0033CC solid; float:left; overflow:hidden;">
         <div id="up1" style="width:100px;height:20px;margin-top:10px;margin-bottom:60px;">上面部分</div>
                  <div id='down1' style='background:#FFF;width:100px;height:90px;position:relative;overflow:hidden; display:none;'>
                          <div id='front1' style='position:absolute;left:0;top:0;width:100px;height:90px;background:#FFFFFF;z-index:10;'>&nbsp;</div>
                          <div id='back1' style='position:absolute;left:0;top:0;width:100px;height:80px;background:#FFFFFF;z-index:9;'>
内容测试
                          </div>
                       </div>
        </div>
        </div></body>
</html>

解决方案 »

  1.   

    onmouseover，onmouseout不兼容firefox？
      

  2.   

    确实，看了网上的一个例子
    <!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> 
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
    <title>无标题文档</title> 
    <style type="text/css"> 
      #b_g_date tr{ 
      event:expression(onmouseover = function(){this.style.backgroundColor='#E3FFC9'},onmouseout = function(){this.style.backgroundColor='#FFFFFF'}); 
    } 
    #b_g_date tr:hover{ 
      background:#E3FFC9; 
    } #b_g_date td{ 
      height:20px; 
    } 
    </style> 
    </head> <body> 
    <table width="500" border="1"  height="300" id="b_g_date"> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
      <tr> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
        <td> </td> 
      </tr> 
    </table> </body> 
    </html>
      

  3.   

    楼上在说什么啊？
    感觉加个高级事件就行了啊
    http://hi.baidu.com/litangfei520/blog/item/61a993fbf02854254f4aeafc.html
    楼主去看看   希望对你有帮助
      

  4.   

    搜了网上的资料  找到解决方法：可参考
    http://vs.net2005.blog.163.com/blog/static/77528105200952310565624/