首页 > 代码库 > jQuery UI特效

jQuery UI特效

      effect(type, options, speed, callback)

$.()          字符串  {对象}  

type效果
blind百叶窗
bounce弹跳
clip将两条相对的边移动至中间相遇
drop掉出页面
explode分解成碎片散射
fade 
fold合并相对的一组边框,对另一组边框做相同操作
highlight改变元素的背景颜色
puff调整不透明度时原地放大或缩小
pulsate闪烁
scale通过百分比放大或缩小
shake来回晃动元素
size重新设定元素的宽度和高度
slide滑入
transfer为临时创建的轮廓元素应用动画,使元素像移动到另一个元素

 

 

           

 

 

  

 

 

 

 

 

 

 

 options:核心animate()方法定义的指定特效的选项

 

扩展方法

使用上表的所有特性

show(effect, options, speed, callback)

hide(effect, options, speed, callback)

toggle(effect, options, speed, callback)

 

扩展类转换方法

addClass(class, speed, easing, callback)

removeClass(class, speed, easing, callback)

toggleClass(class, force, speed, easing, callback)

       easing:传入animate()方法的缓动函数的名称

       force:如果指定为true,则强制toggleClass()方法添加类名,指定为false则强制删除类名

switchClass(removed, added, speed, easing, callback)

使用一个转换特性删除指定的一个或多个类,同时增加指定的一个或多个特效

 

缓动特效

jQuery核心提供了两个缓动特效:linear和swing。jQuery UI将swing重命名为jswing,添加了自己的swing版本。

backgroundPositionborderWidthborderBottomWidth
borderLeftWidthborderRightWidthborderTopWidth
borderSpacingmarginmarginBottom
marginLeftmarginRightmarginTop
outlineWidthpaddingpaddingBottom
paddingLeftpaddingRightpaddingTop
heightwidthmaxHeight
maxWidthminHeightminWidth
fontfontSizebottom
leftrighttop
letterSpacingwordSpacinglineHeight
textIndent  

 

 

 

 

 

 

 

 

 

 

 

高级定位

position(options):使用options的信息对包装元素绝对定位

选项描述
my指定包装元素的位置来使其与目标元素或在at里设置的位置对齐,由top、left、bottom、right和center的两个值构成
at指定目标元素的位置作为重定位元素的目标位置
of目标元素的选择器 ,或者作为目标位置的包含鼠标坐标的Event实例
offset添加到计算出来的位置的偏移量,分别作为left和top,指定单个则同时应用到left和top
collision当被定位元素超出窗体边界指定应用的规则
using替换内部函数来改变元素的位置

 

jQuery UI特效