jQuery通过扩展实现抖动效果的方法
作者:bea
本文实例讲述了jQuery通过扩展实现抖动效果的方法。分享给大家供大家参考。具体实现方法如下: 1. JavaScript代码如下: 代码如下: jQuery.fn.shake = function(intShakes /*Amount of shakes*/, intDistance /*Shake distance*/, intDuration /*Time duration*/) { this.each(function() { var jqNode =
本文实例讲述了jQuery通过扩展实现抖动效果的方法。分享给大家供大家参考。具体实现方法如下:
1. JavaScript代码如下:
代码如下:
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;
}
2. 使用方法如下:
代码如下:
$(function() {
$('#btn').click(function() {
$(this).shake(2,10,400);
});
});
希望本文所述对大家的jQuery程序设计有所帮助。
有用 | 无用
1. JavaScript代码如下:
代码如下:
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;
}
2. 使用方法如下:
代码如下:
$(function() {
$('#btn').click(function() {
$(this).shake(2,10,400);
});
});
希望本文所述对大家的jQuery程序设计有所帮助。
有用 | 无用
猜你喜欢
您可能感兴趣的文章:
- JavaScript设计模式学习之“类式继承”
- 鼠标事件的screenY,pageY,clientY,layerY,offsetY属性详解
- JavaScript中return false的用法
- JavaScript中神奇的call()方法
- jquery实现无限分级横向导航菜单的方法
- JavaScript中定义函数的三种方法
- javascript实时显示北京时间的方法
- jquery实现焦点图片随机切换效果的方法
- JavaScript数据结构与算法之栈详解
- jQuery实现简单的日期输入格式化控件
- Javascript数据结构与算法之列表详解
- javascript实现 百度翻译 可折叠的分享按钮列表
- 基于jquery实现的自动补全功能
- jquery实现页面百叶窗走马灯式翻滚显示效果的方法
- window.open()实现post传递参数
- js运动动画的八个知识点
- js实现最短的XML格式化工具实例
- 微信中一些常用的js方法汇总
- javascript实现checkBox的全选,反选与赋值