0

ナビゲーションメニューで最大制限と最小制限を設定しようとしています。これまでのところ、ほぼ完全に機能するコードを作成しました...

var navmenuliwiwdth = 0;

$('#othermenu ul li').each(function() {
    navmenuliwiwdth += $(this).outerWidth();
});

$('#otherleftarrow').click(function() {
    if ( parseInt($('#othermenu ul').css('margin-left')) < 0 )
        $('#othermenu ul').animate({'margin-left': '+=50'}, 200);
    return false; 
});

$('#otherrighttarrow').click(function() {
    if ( navmenuliwiwdth > 638 && parseInt($('#othermenu ul').css('margin-left')) > (638 - navmenuliwiwdth))
        $('#othermenu ul').animate({'margin-left': '-=50'}, 200);
    return false;
});

右矢印の制限は完全に機能します。しかし、左矢印は非常に頻繁に誤動作します...右矢印を速くクリックし、スライダーを待たずに左矢印を数回クリックすると、50pxのマージンになります。なぜこれが起こるのだろうか、そしてそれを修正する方法があれば、それは何かと関係があることを理解している< 0

何か案は？

私はここで働いていました：http：//jsfiddle.net/sandrodz/TsGqU/5/

4

1 に答える 1

0

アニメーションキューを停止してクリアするには、jQueryでメソッドを設定する必要があり.stop()ます。そうしないと、要素をクリックするときに正常な動作が表示されます。

http://jsfiddle.net/TsGqU/4/ http://jsfiddle.net/TsGqU/7/

詳細については、jQueryAPIhttp://api.jquery.com/stop/を参照してください。

編集：最後のアニメーションが実行されている限りアニメーションがトリガーされないように、別の条件を追加しました。$（[selector]）。is（'：animated'）を使用して、実行中のアニメーションを確認できます。このメソッドはboolを返します。

于 2012-09-25T07:08:05.023 に答える