ie7下的hover和ie8，9的不兼容，怎么办？

用hover功能做了个菜单的样式：在li里的hover事件中，当鼠标移入时在它下面添加一个div，移出时删除这个div。在ie8和ie9下都没问题。但是在ie7下，如果移动的速度过快，或者移到div里的空白处，都会触发hover的移出时间，也就是将div删除了。请问怎么解决这个问题？

解决方案 »

  1.   

    试试给div加overflow:hidden,也许是div高度不够的问题
      

  2.   

    hover切换事件，需要在每一个里面加入一定事件的延迟。例如，你把鼠标移动到div上面，然后过很短的时间(例如100毫秒)之后在删除div。在离开的时候同样的思维，这样子估计就不会出现你的问题了吧。如果还没有解决，那就是你的div的大小不确定，导致看不到div的范围从而不知道鼠标是不是移动到div上面了，可以给div加入北京颜色或者边框，来定位一下div，这个样子调试会更直观。更容易找出问题的所在。
      

  3.   

    现在我给div加背景色就不会消失了，但是我们需要透明效果，怎么即透明又能不让菜单消失呢？
    透明背景是加载了一个透明的图片：.DropMenu_w5{background:url(../images/navigationMenu/transparent_background1.png) repeat;}
      

  4.   

    现在的问题是鼠标在白色背景的div上滑动，就不触发鼠标离开div的事件。但是如果鼠标在div的透明背景图上滑动，就会触发鼠标离开div的事件。不明白为什么会这样，透明背景也是在div上啊，不应该被视为离开div啊？请问怎么解决，即有透明背景，鼠标在上面滑动，div也不会消失？
      

  5.   

    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />  加这个在头部试试呢
      

  6.   

    <!--IE9向下兼容IE8-->
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
    <!--IE8向下兼容IE7-->
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /><!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"> 
      

  7.   

    楼上的方法我也试了，也不行。我想我这个是ie7要向上兼容ie8和ie9吧？