在动画之前关闭打开菜单另一个

问题描述：

我正在做实验，并且仍然在寻找解决此问题的最佳方法。我有多个下拉菜单。我正在尝试检查其他打开的菜单，关闭它们，然后在点击的菜单上运行动画，或者只需关闭已打开的菜单即可。这是我到目前为止。在动画之前关闭打开菜单另一个

$('ul.primary li').click(function(event) { 
      if ($(this).children('ul.drop').is(':visible')) { 
       $(this).children('ul.drop').slideUp(function() { 
        $(this).parent('li').removeClass('active'); 
       }); 
      } 
      else if ($(this).siblings().children('ul.drop').is(':visible')) { 
         $(this).siblings().children('ul.drop').slideUp(function() { 
          $(this).parent('li').removeClass('active'); 
         }); 
         $(this).children('ul.drop').slideDown(function() { 
          $(this).parent('li').addClass('active'); 
         }); 
      } 
      else { 
       $(this).children('ul.drop').slideDown(function() { 
        $(this).parent('li').addClass('active'); 
       }); 
      } 
     });

编辑：我无法弄清楚如何使打开的下拉动画禁区前点击下拉动画开放。的jsfiddle：

你的问题是什么。如果你正在寻找代码审查，然后尝试http://codereview.stackexchange.com –

你可以用标记设置一个小提琴。这将使我们更轻松地使用和可视化。 –

抱歉，缺乏解释。问题是，我无法弄清楚如何在下一个打开之前关闭打开的菜单动画。 JsFiddle：http://jsfiddle.net/JG9dB/ –

答

这是我怎么会去一下....

JAVASCRIPT：

$('ul.primary>li').click(function(event) { 
    var li = $(this); 
    var liOld = $('ul.active').parents("li"); 

    if($('ul.active').length!=0){ 
     $('ul.active').removeClass('active').slideUp('slow', function(){ 
     if(li.index() != liOld.index()){ 
      li.children('ul.drop').slideDown('slow').addClass('active'); 
     } 
     }); 
    } 
    else{ 
    $(this).children('ul.drop').slideDown('slow').addClass('active'); 
    } 
});

DEMO： http://jsfiddle.net/JG9dB/35/

这应该照顾的问题。如果您有任何其他问题，请告诉我！

效果很好！有没有办法减慢这一点，所以它更明显？类似这样的东西：http://www.knapheide.com/ –

是的，当然！在滑动/滑动功能中，您可以用数字替换“快速”/“中等”。该选项用于持续时间，并控制动画长度（以毫秒为单位）。另请参阅我对原始文章所做的更改。希望这可以帮助！ – Dom

我试图减慢它的速度，但似乎一个菜单关闭，另一个打开，而关闭之前关闭事件打开下一个。这就是我试图完成的事情。 –

在动画之前关闭打开菜单另一个

相关推荐