基于jQuery animate封装的一个动态遮罩效果
支持easing库
支持maskIn/maskOut效果设置(有高度渐变、宽度简便、从各个角度进入/退出)
支持遮罩层颜色设置、透明度设置
支持进入、退出速度设置
具体使用方法:
$("#threeimg").animateMask("#four",500,{easing:'backout',maskIn:"heightIn",maskOut:"widthOut",
duration:"slow",color:"#f00",opacity:"0.5"});
$("#threeimg")为鼠标hover事件的对象
"#four"为出现动态遮罩的对象
maskIn/maskOut为进入、退出的效果设置(具体效果有heightIn、widthIn、lefttopIn、righttopIn、leftbottomIn、rightbottomIn和heightOut、widthOut、lefttopOut、righttopOut、leftbottomOut、rightbottomOut,默认效果为从遮罩对象中部变大出现,然后淡出)
duration为退出时的速度设置
color设置遮罩层的颜色
opacity设置遮罩层的透明度
http://jqueryplugin.googlecode.com/files/AnimateMask.zip
支持easing库
支持maskIn/maskOut效果设置(有高度渐变、宽度简便、从各个角度进入/退出)
支持遮罩层颜色设置、透明度设置
支持进入、退出速度设置
具体使用方法:
$("#threeimg").animateMask("#four",500,{easing:'backout',maskIn:"heightIn",maskOut:"widthOut",
duration:"slow",color:"#f00",opacity:"0.5"});
$("#threeimg")为鼠标hover事件的对象
"#four"为出现动态遮罩的对象
maskIn/maskOut为进入、退出的效果设置(具体效果有heightIn、widthIn、lefttopIn、righttopIn、leftbottomIn、rightbottomIn和heightOut、widthOut、lefttopOut、righttopOut、leftbottomOut、rightbottomOut,默认效果为从遮罩对象中部变大出现,然后淡出)
duration为退出时的速度设置
color设置遮罩层的颜色
opacity设置遮罩层的透明度
http://jqueryplugin.googlecode.com/files/AnimateMask.zip
不错的效果,友情支持一下 :-)
要是有demo 就更好了...