jquery 效果

隐藏、显示、切换,滑动,淡入淡出,以及动画,
hide() 隐藏
show() 显示
toggle()隐藏和显示
fadeIn() 淡入隐藏的元素
fadeOut() 淡出可见的元素
fadeToggle() 淡入和淡出元素
fadeTo() 允许渐变为给定的不透明度(值介于 0 与 1 之间)。

语法
$(selector).hide(speed,callback);
$(selector).show(speed,callback);
$(selector).fadeIn(speed,callback);
$(selector).fadeOut(speed,callback);
$(selector).fadeToggle(speed,callback);
$(selector).fadeTo(speed,opacity,callback);

jquery 效果_第1张图片
使用了闭包的函数

jQuery 滑动方法可使元素上下滑动#

slideDown 向下滑动
slideUp 向上滑动
slideToggle 向上滑动和向下滑动;

jQuery animate() 方法允许您创建自定义的动画#

可以对属性进行操作,同时可以对多个属性操作;

语法:
$(selector).animate({params},speed,callback);


jquery 效果_第2张图片
实例

jquery 效果_第3张图片
使用预定义值以及相对值

默认情况下,所有 HTML 元素的位置都是静态的,并且无法移动。如需对位置进行操作,记得首先把元素的 CSS position 属性设置为 relative、fixed 或 absolute。

jQuery stop() 方法用于在动画或效果完成前对它们进行停止#

对动画或者效果在完成前对它们进行停止。
对于停止的结果有可能显示在没有完成的状态或者已经完成的最后状态,这个是需要属性设置的。

Callback 这个是一个回调的内容#

比如,动结果画完成了之后就执行某一个操作,这个和ios的实现的结果是一样。

Chaining 允许我们在一条语句中允许多个 jQuery 方法(在相同的元素上)#

$("#p1").css("color","red").slideUp(2000).slideDown(2000);


jquery 效果_第4张图片
有感chaining的技术

你可能感兴趣的:(jquery 效果)