Question

我想在连续循环中从左到右平滑地制作文本动画，任何人都可以建议我这里的东西是小提琴链接： http://jsfiddle.net/yLNGn/3/

 $(document).ready(function () {
    $('.kp').animate({
        left: '10px'
    }, 600);
    $('.kp').delay(600).animate({
        left: '-128px'
    }, 600);
    $('.rp').delay(2000).animate({
        left: '10px'
    }, 600);
    $('.rp').delay(600).animate({
        left: '-108px'
    }, 600);
    $('.kpp').delay(4000).animate({
        left: '10px'
    }, 600);
});

Answer 1

见这是答案。我把它作为单独的函数与小提琴看到这里。

function repeat() {
    $('.kp').animate({
    left: '10px'
}, 600);
$('.kp').delay(600).animate({
    left: '-128px'
}, 600);
$('.rp').delay(2000).animate({
    left: '10px'
}, 600);
$('.rp').delay(600).animate({
    left: '-108px'
}, 600);
$('.kpp').delay(4000).animate({
    left: '10px'
}, 600);
    $('.kpp').delay(600).animate({
        left:'-108px'
   },600 ,function() {
        repeat();
    });
}

Fiddle

希望它可能有所帮助。

Answer 2

好吧，您可以使用setInterval函数，或者如果您使用jquery animate方法的完整回调：

$(document).ready(function () {
  console.log('ready');

  var james = $('#bond');

  var right = function () {
    james.animate({left: '100px'}, 600, left);
  };

  var left = function () {
    james.animate({left: '0px'}, 600, right);
  };

  right();
});

这是完整的小提琴示例：http://jsfiddle.net/yLNGn/32/

Answer 3

您是否考虑过使用this jQuery plugin？

使用jquery在连续循环中左右文本动画

3 个答案: