IE选择悬停问题

Question

朋友和我自己正在尝试解决IE(7/8).我们在这里建立了一个规范的例子:

http://www.mathgladiator.com/share/ie-select-bug-hover-css-menus.htm

使用CSS菜单,我们希望在其中选择.但是,在IE中,当您与选择框进行交互时,菜单会消失.我们认为这与选择如何影响事件的错误有关.

有解决方法吗？至少使用纯CSS或DOM黑客？

Answer 1

我不认为这有一种纯粹的CSS方式.这是因为IE处理选择元素上的事件的方式存在一个非常常见的错误.

但是,您可以使用Javascript解决它:

<script type="text/javascript">
    $(document).ready(function () {
        $('.nav_element a').mouseover(function() {
            $('.submenu').hide();
            $(this).parent().find('.submenu').show();
        });

        $('.submenu').mouseover(function() {
            $(this).show();
        });

        $('.submenu').mouseout(function (e) {
            // Do not close if going over to a select element
            if (e.target.tagName.toLowerCase() == 'select') return;
            $(this).hide();
        });

    });    
</script>

上面的代码使用jQuery.