javascript - jQuery悬停+绝对位置= IE中的问题

我正在制作一个下拉菜单，它在所有现代浏览器中都很好用，但是我不确定，它在IE中失败，当我尝试选择子菜单的子元素时，它消失了。

这是页面：http://XXX/

这是JS代码

$("nav li").hover(function(){
    $(".subnavi-wrapper", $(this)).show();
}, function(){
    $(".subnavi-wrapper", $(this)).hide();
});

编辑：显然是下拉菜单顶部的页边距似乎在IE中激活了“ mouseout”！显然，jQuery绝对无法检测到绝对位置的项目区域！ :(

最佳答案

这是因为在Li元素中阻止了“ subnavi-wrapper”。您必须删除DIV并仅使用Ul元素尝试这样做。我在这里做了类似的事情：http://www.muzykakoncerty.pl

在这里，像这样：

$('#menu > ul > li').each(function() {
    if($('ul', this).length > 0) {
        $(this).hover(
            function() {
                $('ul', this).show();
            },
            function() {
                $('ul', this).hide();
            }
        );
    }
});

我的菜单HTML代码是：

          <div id="menu">
              <ul>
                  <li>
                      <a href="index.html">wstęp</a>
                  </li>
                  <li>
                      <ul>
                          <li><a href="zespol-big-band.html">Big Band</a></li>
                          <li><a href="zespol-arti-sound-concert.html">Arti Sound Concert</a></li>
                          <li><a href="zespol-leszczynska-kapela-barokowa.html">Leszczyńska Kapela Barokowa</a></li>
                      </ul>
                      <a href="#">zespoły</a>
                  </li>
                  <li>
                      <ul>
                          <li><a href="taniec-dancing-sisters.html">Dancing Sisters</a></li>
                      </ul>
                      <a href="#">taniec</a>
                  </li>
                  <li>
                      <a href="o-mnie.html">o mnie</a>
                  </li>
                  <li>
                      <a href="kontakt.html">kontakt</a>
                  </li>
              </ul>
          </div>

编辑：

所以尝试一下：

$('nav > ul > li').each(function() {
    if($('ul', this).length > 0) {
        $(this).hover(
            function() {
                $('ul', this).show();
            },
            function() {
                $('ul', this).hide();
            }
        );
    }
});