jQuery的脉动文本 [英] jquery pulsating text

问题描述

我正在使用jquery脉动文本.很好-但是我无法直言不讳:我只想跳动x次，然后停下来.我正在使用以下代码来激发一个类:

I'm using jquery to pulsate text. All fine - but I can't get my head around something: I would only like to pulsate x-number of times and then stop. I'm using the following code to pulsate a class:

$(document).ready(function() {
  function pulsate() {
    $(".pulsate").
      animate({opacity: 0.2}, 1000, 'linear').
      animate({opacity: 1}, 1000, 'linear', pulsate);
  }
  pulsate();
});

有什么想法可以做到这一点吗?可能是一行代码...?！

Any ideas how this can be achived? Probably one line of code...?!

推荐答案

最简单的方法是只计算:

The simplest way is to just count:

$(document).ready(function() {
  var i = 0;
  function pulsate() {
    if(i >= 3) return;
    $(".pulsate").
      animate({opacity: 0.2}, 1000, 'linear').
      animate({opacity: 1}, 1000, 'linear', pulsate);
    i++;
  }
  pulsate();
});

在此处尝试.或者，将所有动画一次排在for循环中，如下所示:

Try it here. Or, queue up all the animations at once in a for loop, like this:

$(function() {
  var p = $(".pulsate");
  for(var i=0; i<3; i++) {
    p.animate({opacity: 0.2}, 1000, 'linear')
     .animate({opacity: 1}, 1000, 'linear');
  }
});

在此处尝试该版本.

这篇关于jQuery的脉动文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！