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;
}

调用方法:

$("抖动元素").shake(次数, 距离, 持续时间);

$("#userName").shake(2, 10, 400);

转载

jquery 实现抖动效果的更多相关文章

  1. jQuery实现抖动效果

    //抖动效果 //intShakes:抖动次数:intDistance:抖动左右距离:intDuration:持续时间 jQuery.fn.shake = function (intShakes, i ...

  2. Jquery实现的图标抖动效果

    原文:http://www.webdm.cn/webcode/75de64a9-3fb4-473d-bc2c-97a0a063be79.html <!DOCTYPE html PUBLIC &q ...

  3. CSS Shake – 摇摆摇摆!动感的 CSS 抖动效果

    CSS Shake 是一套 CSS3 动画特效,让页面的 DOM 元素实现各种效果的抖动(Shake),这些效果可以轻松的被应用到按钮.LOGO 以及图片等元素.所有这些效果都是只需要单一的标签,加上 ...

  4. jQuery实现放大镜效果

    1.1.1 摘要 相信大家都见过或使用过放大镜效果,甚至实现过该效果,它一般应用于放大查看商品图片,一些电商网站(例如:凡客,京东商城,阿里巴巴等)都有类似的图片查看效果. 在接下来的博文中,我们将向 ...

  5. iOS 为视图添加抖动效果

    抖动效果在开发中比较少用到,不过有时使用了确有个很好的装逼效果,用的时候就例如一些用户错误操作之类的 效果如下,不过gif看到的效果没实际的好看 上代码 - (void)shakeAnimationF ...

  6. jquery左右滑动效果的实现

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. 仿jQuery的siblings效果的js原生代码

    仿jQuery的siblings效果的js原生代码 <previousSibling> 属性返回选定节点的上一个同级节点(在相同树层级中的前一个节点). <nextSibling&g ...

  8. JQuery实现广告效果(滚动切换)

    JQuery实现广告效果(滚动切换)   Html+css 效果如上图 代码: <!DOCTYPE html> <html> <head lang="en&qu ...

  9. 让DIV实现抖动效果!

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

随机推荐

  1. mac 开启 chrome 和 微信开发者工具 跨域

    微信开发者工具:open -n /Applications/wechatwebdevtools.app --args --disable-web-security --user-data-dir=/U ...

  2. PHP5缓存插件

    1.1操作码介绍及缓存原理 当客户端请求一个PHP程序时,服务器的PHP引擎会解析到该PHP程序,并将其变异为特定的操作码文件(OperateCode opcode),这是要执行的PHP代码的一种二进 ...

  3. 第七篇 Flask 中路由系统

    1. @app.route() 装饰器中的参数 如果不明白装饰器 点击这里 methods : 当前 url 地址,允许访问的请求方式 @app.route("/info", me ...

  4. Rhythmk 一步一步学 JAVA (17):Servlet 文件上传

    1.环境 : JDK 1.6 , Tomcat 7.0 2.第三方类库: commons-fileupload-1.3.1.jar commons-io-2.4.jar 3.web.xml配置: &l ...

  5. setKeepAliveTimeout

    setKeepAliveTimeout 定期唤醒 间隔至少600秒唤醒,唤醒后执行的代码最多10秒要执行完成. 与setMinimumBackgroundFetchInterval的区别呢?perfo ...

  6. 汉字转拼音开源工具包Jpinyin介绍

    最近要实现一个根据词语得到词语对应拼音的功能,找到了Jpinyin这个开源工具包,使用下来发现它非常强大,完全满足我的需求,下面对它做一个简单的介绍,希望能够帮助到有需要的朋友. https://gi ...

  7. 虚拟化 - kvm安装

    vmware centos6.5 64位 kvm虚拟化安装配置 安装 centos 64位 1.推荐配置 内存 2G 硬盘50G,或者再单独分一个磁盘,用来存储虚拟机文件 最关键的一步,在创建虚拟机时 ...

  8. 数据库连接池--druid

    数据库连接池常用的有:dbcp,c3p0,druid 代码仓库(https://github.com/) package com.huawei.test; import java.sql.Connec ...

  9. 【HDU4734】F(x) 【数位dp】

    题意 先定义了一个函数F(X)=An*2^n-1+An-1*2^n-2+.....+A1*1.其中Ai为X的第i位的值.对于每组数据给出了两个整数A,B.问不超过B的数中有多少的F值是不超过F(A)的 ...

  10. Python 2.7 爬取51job 全国java岗位

      一页有50条数据一共2000页 分页是get分页 #!/usr/bin/python # encoding: utf-8 import requests import threading from ...