jquery 实现抖动效果

最新推荐文章于 2023-07-05 11:26:43 发布

转载最新推荐文章于 2023-07-05 11:26:43 发布 · 541 阅读

1 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/suanshun/p/10406169.html

文章标签：

#javascript #ViewUI

本文介绍了一个使用jQuery实现的简单动画效果——抖动。通过自定义的jQuery函数，可以轻松地为页面元素添加抖动动画，只需指定抖动次数、距离和持续时间。示例代码展示了如何创建和调用该函数。

jQuery.fn.shake = function (intShakes /*Amount of shakes*/, intDistance /*Shake distance*/, intDuration /*Time duration*/) {
    this.each(function () {
        var jqNode = $(this);
        jqNode.css({ position: 'relative' });
        for (var x = 1; x <= intShakes; x++) {
            jqNode.animate({ left: (intDistance * -1) }, (((intDuration / intShakes) / 4)))
            .animate({ left: intDistance }, ((intDuration / intShakes) / 2))
            .animate({ left: 0 }, (((intDuration / intShakes) / 4)));
        }
    });
    return this;
}