2

次のコードを機能させようとしています。

ユーザーがポイント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;
});
4

1 に答える 1

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;
});
于 2013-03-20T17:27:15.367 に答える