Question

我无法让它正常工作。它会在错误的时间更改文本（如演示中所示）。我想我会以错误的方式解决这个问题（主要是setTimeout是不必要的）。有人可以看看吗？

var testimonials = ['This', 'is', 'kind', 'of', 'working']

$.each(testimonials, function (i, val) {
  setTimeout(function () {
   //Slide In
    $('#testimonials blockquote').show("slide", {
      direction: "right"
    }, 1500, function () {
     //Slide Out
      $(this).text(val).hide("slide", {
          direction: "left"
      },
         1500);
    });
  }, i * 3000);
});

**我也希望它永远循环。

Answer 1

您应该在显示项目之前更改文本，可以在.hide()的回调中或show()之前。还重构了你的逻辑以使用回调代替setTimeout：

var testimonials = ['This', 'is', 'kind', 'of', 'working'],
    i = 0,
    l = testimonials.length,
    $el = $('#testimonials blockquote');
(function loopTestimonials() {
    $el.text(testimonials[i++ % l]).show("slide", {
        direction: "right"
    }, 500, function () {
        $(this).delay(2000) //milliseconds to stay in screen
        .hide("slide", {
            direction: "left"
        }, 500, loopTestimonials); //restart show/hide loop when hide completes
    });
}());

Fiddle

在jquery中使用数组旋转推荐

1 个答案: