jQuery下拉菜单隐藏ul li ul

时间:2014-02-03 20:17:35

标签: jquery css

我是 jQuery 的新手。我试图理解为什么这个下拉菜单出现在jQuery效果之前。我无法禁用"ul li ul"所以它只能由 jQuery 处理。我真的很感激任何想法。

我已添加指向网站here

的链接

只要你悬停菜单,ul飞出然后执行jQuery效果......

这是JavaScript

<script type='text/javascript'>
  jQuery(document).ready(function(){
    jQuery('.menu-meny-1-container ul li').hoverIntent({
      over : navover,
      out : navout,
      timeout : 400
    });
    // (how to use both fade and slide effects!):
    function navover(){
      jQuery(this).children('ul')
        .stop(true,true)
        .fadeIn({duration:600,queue:false})
        .css('display','none')
        .slideDown(600);
    }
    function navout(){
      jQuery(this).children('ul')
        .stop(true,true)
        .fadeOut({duration:300,queue:false})
        .slideUp(300);
    }
  });
</script>

以下是相关的CSS:

.main-navigation ul li:hover > ul {
    border-left: 0 none;
    display: block;
}
.main-navigation li ul {
    display: none;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 100%;
    z-index: 1;
}
.main-navigation ul {
    margin: 0;
    text-indent: 0;
}

1 个答案:

答案 0 :(得分:1)

.main-navigation ul li:hover > ul {
    border-left: 0 none;
    display: none; /* CHANGED 'BLOCK' TO 'NONE' */
}