当前位置:  开发笔记 > 前端 > 正文

如何使用GreenSock同时为2个或更多元素制作动画?

如何解决《如何使用GreenSock同时为2个或更多元素制作动画?》经验,为你挑选了1个好方法。

我想使用Green Sock一次动画两个不同的元素.如何修改下面的代码,以便它们同时执行完全动画而不是一个接一个地执行?

tlProject = new TimelineMax({});    

tlProject.from($animated_bowl, 2, {opacity: 0, scale: 0, ease: Bounce.easeOut})
    .from($animated_bowl_shadow, 2, {opacity: 0, scale: 0, ease: Bounce.easeOut});

谢谢!



1> victmo..:

.from(),.to().fromTo()方法TimelineMax可以采取额外的position,它可以控制你的补间的位置参数.

对于您的特定情况,您只需要告诉每个补间从0(零)开始.

tlProject = new TimelineMax();
tlProject.from($animated_bowl, 2, {opacity: 0, scale: 0, ease: Bounce.easeOut}, 0)
    .from($animated_bowl_shadow, 2, {opacity: 0, scale: 0, ease: Bounce.easeOut}, 0);

查看这个非常棒的教程,以便更好地了解position参数的工作原理以及使用它可以做的所有事情:https://greensock.com/position-parameter.

另一个选择是同时传递两个元素,如 target

tlProject = new TimelineMax();
tlProject.from([$animated_bowl, $animated_bowl_shadow], 2, {opacity: 0, scale: 0, ease: Bounce.easeOut});

推荐阅读
手机用户2402852387
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有