jquery，不知道为什么动画高度不能按预期工作

Question

我试图让下面的代码工作。

当用户滚动到点x时，菜单包装的高度降低。他们可以通过点击.extender来恢复高度。点击此链接后，链接消失（所以没有切换功能）。

我看到切换往往是类似用例的解决方案，我最好想知道如何解决这个问题，以及为什么我的代码不起作用。

$(document).scroll(function(){ 
    var height = $('div#zone-menu-wrapper').height(); 
    if (some_logic){ 
     $('div#zone-branding-wrapper').animate({height: 10}, 1500); 
    } 
}); 

$('.extender').click(function(){ 
    $('div#zone-branding-wrapper').animate({height: 380}, 1500); 
    return false; 
}); 

Answer 1

如果动画已在进行中，则返回。

var inProgress = false; 
$(document).scroll(function(){ 
    if(inProgress)return; 
    var height = $('div#zone-menu-wrapper').height(); 
    if (some_logic){ 
     inProgress = true; 
     $('div#zone-branding-wrapper').animate({height: 10}, 1500, function(){ 
        inProgress = false; 
     }); 
    } 
}); 

$('.extender').click(function(){ 
    $('div#zone-branding-wrapper').animate({height: 380}, 1500); 
    return false; 
});