Question

在此幻灯片中重复内容的最佳方式是什么，所以当您点击.left并且转盘开始移动时，您会得到一个无休止的循环？目前，如果您单击.left，则转盘开始移动并留下空白区域。

var loop;
var moveRight = function(){
    $('.box').animate({left: '-=10'}, 100);
};

var moveLeft = function(){
    $('.box').animate({left: '+=10'}, 100);

};

$('.right').mousedown(function(){
    loop = setInterval(moveRight, 200);
}).mouseup(function(){
    clearInterval(loop);
});

$('.left').mousedown(function(){
    loop = setInterval(moveLeft, 200);
}).mouseup(function(){
    clearInterval(loop);
});

任何帮助都会很棒。

Answer 1

这是一个关于“左”运动的演示（尽管我认为你的方向很混乱）：

var moveLeft = function(){
    $('.box').animate({left: '+=10'}, 100, function(){
        var $last = $('.box').last();
        if ($last.css('left') == '100px') {
            $last.prependTo('.container').before('\n\r');
            $('.box').css('left','0px');
        }
    });
};

它检查元素是否移动了100px，如果是，则移动最后一个元素。注意我也在那里添加CrLf以保持原始格式和DIV之间的距离（如果你不需要它就把它删除）。

“左”演示：http://jsfiddle.net/mZRQx/3/

预先录制内容

1 个答案: