如何隐藏子窗口菜单直到鼠标悬停?

时间:2011-06-08 22:23:28

标签: javascript show-hide drop-down-menu

我正在使用子导航菜单,它可以在鼠标悬停时设置动画。它工作得很好,除了初始页面加载时,菜单默认显示。当你指出鼠标时,它会按预期消失,但我无法弄清楚如何在页面加载时隐藏它,然后在悬停时显示它。

<script type="text/javascript">
function nav(){
$('.nav li').hover(function() {
     $(this).find('ul:first').stop().animate({height: '200px', opacity: '100'},    {queue:false, duration:200, easing: 'easeInSine'})
        }, function() {
     $(this).find('ul:first').stop().animate({height: '0px', opacity: '0'},    {queue:false, duration:100, easing: 'easeInCirc'}) 
      });
  };
  $(document).ready(function() {
    nav();
});
</script>

1 个答案:

答案 0 :(得分:0)

将一个类添加到子菜单<ul>并添加css规则以设置display: none;例如:

<ul class="subMenu">

.subMenu { display: none; }