位置: 编程技术 - 正文
推荐整理分享jQuery之动画效果大全(jquery的动画效果),希望有所帮助,仅作参考,欢迎阅读内容。
文章相关热门搜索词:jquery的动画函数,jquery动画库,jquery的动画函数,jquery的动画函数,jquery的动画函数,jquery中的动画是怎样用的,jquery常用动画制作,jqueryanimate动画,内容如对您有帮助,希望把文章链接给更多的朋友!
下面介绍了几种动画效果的方法,具体如下:
1、show()显示效果
语法:show(speed,callback) Number/String,Function speend为动画执行时间,单位为毫秒。也可以为slow","normal","fast" callback可选,为当动画完成时执行的函数。
show(speed,[easing],callback) Number/String easing默认是swing,可选linear;
2、hide()隐藏效果
语法:hide(speed,callback) Number/String,Function
hide(speed,easing,callback) Number/String
3、toggle()隐藏显示自动切换,当目前为显示则隐藏,当目前为隐藏则显示
语法:toggle(speed,callback) Number/String,Function
toggle(speed,callback) Number/String,String,Function
4、slideDown()向下显示,slow()是水平与垂直方向同时展开,而slideDown是仅仅在垂直方向向下展开
语法:slideDown(speed,callback) Number/String,Function
slideDown(speed,[easing],callback) Number/String,Function
5、slideUp()向上隐藏, hide()是水平与垂直两个方向的,而slideUp()仅仅是垂直方向向上收起隐藏
语法:slideUp(speed,callback) Number/String,Function
slideUp(speed,[easing],callback) Number/String,String,Function
6、slideToggle垂直方向上切换,toggle是水平与垂直两个方向上的,而slideToggle是仅仅垂直方向的。
语法:slideToggle(speed,callback) Number/String,Function
slideToggle(speed,[easing],callback) Number/String,String,Function
7、fadeIn() 以改变透明度来显示
语法:fadeIn(speed,callback) Number/String,Function
fadeIn(speed,[easing],callback) Number/String,Function
8、fadeOut() 以改变透明度来隐藏
语法:fadeOut(speed,callback) Number/String,Function
fadeOut(speed,[easing],callcack) Number/String,String,Function
9、fadeToggle() 以改变透明度来切换显示隐藏状态
语法: fadeToggle(speed,callback) Number/String,Function
fadeToggle(speed,[easing],callback) Number/String,Function
、fadeTo() 由指定的时间将透明度改变到指定的透明度
语法:fadeTo(speed,callback) Number/String,Function
fadeTo([speed],opacity,[easing],[fn]) Number/String,Float,String,Function
、animate() 自定义动画,一般来说数字变动都可以用于动画。
语法:animate(params,speed,easing,callback); 样式参数,时间,可选择,函数
其中params要用中括号括起来,可以使用的css样式参数。注意要采用骆驼法则,如font-size要写成fontSize。颜色渐变不支持。
backgroundPositionborderWidthborderBottomWidthborderLeftWidthborderRightWidthborderTopWidthborderSpacingmarginmarginBottommarginLeftmarginRightmarginTopoutlineWidthpaddingpaddingBottompaddingLeftpaddingRightpaddingTopheightwidthmaxHeightmaxWidthminHeightmaxWidthfontfontSizebottomleftrighttopletterSpacingwordSpacinglineHeighttextIndent
、stop() 停止正在执行动画
stop([clearQueue],[gotoEnd]); 两个参数均为布尔值,第一个表示,是否停止动画执行、第二个表示,如果停止,是否立即变为执行完成的状态,如果设置为否,则停留在执行一半的状态。
、delay() 延迟执行动画 当一个动画stop()了之后还能够用delay()来延迟执行。从停止位置继续执行。当然用原来的方法继续执行也不可,不过没有延时效果。
、jQuery.fx.off//该属性只是是否关闭当前页面上的动画,关闭动画之后,没有动画效果,所有设置了执行时间的动画会瞬间完成。注意此属性出现的位置。出现的位置不同影响的范围也不同。
、jQuery.fx.interval //该属性设置动画的帧速,单位是毫秒,如果设置的时间越小,就越平滑。,属性出现的位置同样有影响范围
标签: jquery的动画效果
本文链接地址:https://www.jiuchutong.com/biancheng/377802.html 转载请保留说明!上一篇:jQuery学习笔记——jqGrid的使用记录(实现分页、搜索功能)(jquery基础知识)
下一篇:DataTables+BootStrap组合使用Ajax来获取数据并且动态加载dom的方法(排序,过滤,分页等)
友情链接: 武汉网站建设