1

我必须修复http://rhemapress.pl/www_wopr/上的底部滑块。如果您在单击右箭头两次时看到，则动画将重新开始并再次动画。在这里，当我在右箭头上单击一个时，这应该被阻止并且无法第二次单击。

向右移动的次数由 checkWidth() 动态创建；

    function checkWidth() {

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

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

        return width;
    }

这个 return realWidth 女巫有点像偏移限制。变量偏移在开始时设置为 0。因此，如果我单击右键，则在方法 moveRight() 中检查元素是否可以移动并且它正在移动。最后偏移量增加了 820px（滑块的一页），所以如果我们有 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

似乎您想阻止在当前动画完成之前触发 click 事件。如果元素当前正在动画，您可以通过阻止函数的其余部分执行来做到这一点：

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