ie7 mouseleave时如何不隐藏子菜单？

Question

导航菜单包括子菜单，当鼠标移入需要显示子菜单，鼠标移出则隐藏子菜单，但是在ie7下只要鼠标移出父级div时子菜单就消失了，鼠标永远无法移入到子菜单。
HTML如下

<div class="parentdiv">
    <span>父菜单1</span>
    <div class="submenu">
        <ul>
            <a href=""><li>子菜单1</li></a>
            <a href=""><li>子菜单2</li></a>
            <a href=""><li>子菜单3</li></a>
        </ul>
    </div>
</div>
<div class="parentdiv">
    <span>父菜单2</span>
    <div class="submenu">
        <ul>
            <a href=""><li>子菜单1</li></a>
            <a href=""><li>子菜单2</li></a>
            <a href=""><li>子菜单3</li></a>
        </ul>
    </div>
</div>

jQuery如下

$('.parentdiv').mouseenter(function(){
        $(this).children('.submenu').show();
}).mouseleave(function(event){
        $(this).children('.submenu').hide();
});

这样写在ie8 chrome下都可以正常显示，ie7不行，请问要如何解决？

Answer 1

我在ie7下面测试也是可以的啊。
但对于你说的“只要鼠标移出父级div时子菜单就消失了，鼠标永远无法移入到子菜单。”这个问题，可以用setTimeout函数，延迟子菜单hide，然后在mouseenter事件里clearTimeout

Answer 2

有可能是因为定位的问题，你是否用了绝对定位，IE7有bug