如何在jQuery中实现连续动画

时间:2011-11-26 00:39:08

标签: javascript jquery animation

在页面中,我有一个箭头,它在开头隐藏。当我单击按钮时,箭头显示。

我想要一个功能,箭头会不断变大并返回到原始大小,然后再次变大,表现出注意它所指向的位置。

1 个答案:

答案 0 :(得分:4)

DEMO jsBin

使用的代码:

<img id="arrow" src="arrow.png">


var ar = $('#arrow');
function pulsate(){ 
  ar.animate({width:'+=5',height:'+=5'},300,function(){
    ar.animate({width:'-=5',height:'-=5'},300,pulsate);
  });
}
pulsate();

(希望这就是你要找的......)


P.S。
您还可以封装函数,如:

var ar = $('#arrow');
(function tic(){ 
  ar.animate({width:'+=5',height:'+=5'},300,function(){
    ar.animate({width:'-=5',height:'-=5'},300,tic);
  });
})();