1

http://rhemapress.pl/www_wopr/の下部スライダーを修復する必要があります。右矢印を 2 回クリックすると、アニメーションが元に戻り、再びアニメーションが開始されます。ここで右矢印の 1 つをクリックすると、これはブロックされ、2 回目はクリックできなくなります。

右の手の数は、checkWidth() によって動的に作成されます。

    function checkWidth() {

        var elements = $('.items').children().length;

        var width = Math.ceil(elements / 5) * 820;

        return width;
    }

この return realWidth ウィッチは、オフセットの制限のようなものです。可変オフセットは開始時に 0 に設定されます。したがって、右クリックすると、メソッド moveRight() で、要素を移動できるかどうかがチェックされ、移動されます。終了オフセットは 820px (スライダーの 1 ページ) ずつ増加するため、2 ページある場合、次の動きを呼び出すことはできません。しかし、これは問題です！:/

私のコード

<script type="text/javascript">
$(document).ready(function() {
    $('a.prev').bind('click',moveLeft);
    $('a.next').bind('click',moveRight);


    var realWidth = checkWidth(); 
    realWidth -= 820;

    var offset = 0;


    function moveLeft(e) {

        var position = $('.items').position();
        var elements = $('.items').children().length;

        if ((elements > 5) && ((offset - 820) >= 0) ) {
            $('.items').animate({
            'left': (position.left + 820)
            }, 300, function() {
                offset -= 820;
            });

        }
    }

    function moveRight(e) {

        var position = $('.items').position();
        var elements = $('.items').children().length;

        if ((elements > 5) && ((offset + 820) <= realWidth)) {        

            $('.items').animate({
            'left': (position.left - 820)
            }, 300, function() {
                offset += 820;
            });
        }
    }

    function checkWidth() {

        var elements = $('.items').children().length;

        var width = Math.ceil(elements / 5) * 820;

        return width;
    }
});
</script>

どうすればこれを正しく行うことができますか?

4

1 に答える 1

0

現在のアニメーションが完了する前にクリック イベントが発生するのを防ぎたいようです。要素が現在アニメーション化されている場合、関数の残りの部分が実行されないようにすることで、これを行うことができます。

function moveLeft(e) {
   if ($(this).is(":animated")) {
      return false;
   }
于 2012-12-11T10:25:23.207 に答える