100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > JQuery中的animate自定义动画

JQuery中的animate自定义动画

时间:2019-07-01 03:30:55

相关推荐

JQuery中的animate自定义动画

animate()方法用于创建自定义动画。

概述.animate( properties [, duration ] [, easing ] [, complete ] )
properties

类型: PlainObject

一个CSS属性和值的对象,动画将根据这组对象移动。

duration(默认:400)

类型: Number or String

一个字符串或者数字决定动画将运行多久。或表示动画时长的毫秒数值(如:1000) )

easing(默认:swing)

类型: String

一个字符串,表示过渡使用哪种缓动函数。(译者注:jQuery自身提供"linear" 和 "swing")

complete

类型: Function()

在动画完成时执行的函数。

语法:

$(selector) .animate( {params},speed,callback);
必需的params参数定义形成动画的CSS属性。可选的speed参数规定效果的时长。它可以取以下值:“slow”、“fast”或者毫秒。可选的callback参数是动画完成所执行的函数名称。

例子:

<body><input type="button" value="自定义动画" id="btn"><div>利宾一家人</div><script>$(function() {$("#btn").on("click", function() {$("div").animate({"left": "500px","top": "400px"}).animate({"font-size": "30px"})})})</script></body>

效果图:

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。