循环图像动画

Question

我有一个动画的图像。

$('.user-card').css('-webkit-transform', 'translate(-55px, 0)');

上面的代码将图像从右向左移动55px。我希望它在向左移动后向右移动或移动到第一个位置。

另外，我希望它永远循环这个动作。

Answer 1

您可以使用简单的CSS3动画定义一个类，并使animation-iteration-count值无限;然后，您可以使用addClass()在页面加载时创建此动画，或作为对事件的响应。

<强> Example

Answer 2

var doForever = $(document).ready(function(){
    $('.user-card').css('-webkit-transform', 'translate(-55px, 0)');
    $('.user-card').css('-webkit-transform', 'translate(+55px, 0)');
doForever();
});

doForever();