javascript - 实现摇动动画的更好方法？

Question

我正在尝试使用 jQuery 实现“摇动动画”。这个想法是，您可以使元素摇晃以引起人们的注意。以下是我想出的：

    function DrawAttention(item, count)
    {
        $(item).animate({top: '+=5'}, 50,
            function(){
                $(item).animate({top: '-=10'}, 100,
                    function(){
                       $(item).animate({top: '+=5'}, 50,
                            function(){
                                if(count>0)
                                {
                                    DrawAttention(item,count-1);
                                }
                            }); 
                    });
            });

    }

我认为这有点冗长，并且想知道是否有人可以看到一种更优雅的方式来实现我想要的。

在这里拉小提琴。

Answer 1

function DrawAttention(item, count)
{
    $(item)
        .animate({top: '+=5'}, 50)
        .animate({top: '-=10'}, 100)
        .animate({top: '+=5'}, 50, function(){
            if(count > 0){
              DrawAttention(item,count-1);
            }
        });
}

Answer 2

据我所知，jQuery Ui (jqueryui.com) 对此有影响。尝试这将是另一种选择。

如果您想自己执行此操作，我会使用指数函数（如 2^-x）来计算抖动偏移。