animate()函数

72 阅读 0 评论 48 点赞

我是靠谱客的博主神勇微笑，最近开发中收集的这篇文章主要介绍animate()函数，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

1：动画
$(‘p’).animate({‘left’:1000},2000,function(){
$(this).css(‘background-color’,‘red’)
});
封装的animate语法基本和jQuery一样，只不过jQuery是对象打点： $(‘选择器’).animate(终点JSON，动画时间，回调函数)；
其实是有缓冲的，jQuery需要插件来完成。jQuery默认不是匀速，是easeInOut，和我们封装的框架不一样，jQuery默认有一个处理机制，叫做动画排队。当一个元素接受到了两个animate命令之后，后面的animate会排队：
$(‘p’).animate({‘left’:1000},2000);
$(‘p’).animate({‘top’:400},2000);
先2000毫米横着跑，然后2000毫秒竖着跑。动画总时长4000。
如果想让元素斜着跑，就是同时变化left和top，就写在同一个JSON里面：
$(‘p’).animate({‘left’:1000,‘top’:400},2000);