我有一个Camera类,它具有两个要同时设置动画的属性。 我想为其distance属性(它是一个数字)和rotation属性(它们具有x, y, z元素)设置动画。 我尝试了以下操作:

尝试1:

TweenLite.to(this.camera, 1.0, {distance: 30, rotation.y: 10, rotation.x: 50});

尝试2:

TweenLite.to(this.camera, 1.0, {distance: 30, rotation:{y: 10, x: 50}});

尝试1失败,因为它不允许在vars参数内使用点号。 尝试2静默失败,并且我也没有任何动画(在TweenLite v:1.20.2中)。 是否有可以同时触发距离和旋转动画的语法? 一旦我拥有多个动画属性,唯一起作用的方法就会变得非常冗长:

TweenLite.to(this.cam, 1.0, {distance: 30});
TweenLite.to(this.cam.rotation, 1.0, {y:10, x: 50});
TweenLite.to(this.cam.position, 1.0, {x:0.5, z: 3});

#1楼 票数:0

我认为您需要使用AttrPlugin

TweenLite.to(this.camera, 1, {attr:{distance: 30, rotation:{y: 10, x: 50}}});

  ask by Marquizzo translate from so

未解决问题?本站智能推荐:

2回复

使用TweenLite/GSAP选择DOM对象的最佳方法?

我正在使用TweenLite来构建一些横幅广告。 我的一切工作正常,但是我对如何选择元素感到困惑,或者至少是使用TweenLite选择元素的最佳实践。 起初我使用这个: 选择元素,然后使用以下动画制作动画: 但是,我发现动画仍然有效,而没有将#logo声明为变量。 我的问题是,
1回复

用Tweenlite被动地补间属性

我希望能够被动地补间对象上的属性,以便在补间期间可以更新该对象,并且TweenLite会继续进行。 例如,以下代码将在15秒内将对象中的坐标从0过渡到15 。 在发生这种情况的同时,我还想更新target.position的x和y变量,因为TweenLite似乎“ hog”了对象直到完成(
1回复

在TweenMax中暂停补间时的动量

在TweenMax暂停补间时可以施加动量吗? 以这个小提琴为例,暂停时可以在一秒钟的时间内使盒子变慢。 我知道可以通过创建一个新的补间来实现,但是如果有一个内置的补间方法可以实现这一点。
2回复

与GSAP并行播放2个补间?

有人可以简要解释一下使用GSAP 3在同一时间线中并行播放 2 个补间动画/动画的最佳方法是什么吗? 例子: 我会这样做: '-=1' 。 大家对我有更好的解决方案吗?
2回复

补间动画完成后,实现诺言

我正在使用Tween制作动画,一旦动画完成,我想触发另一个操作来设置iframe的src 。 我知道我需要使用promise,但是我不确定在这种情况下如何实现promise,并且已经尝试了一段时间。 它适用于以下代码 但是当我尝试以下操作时它不起作用
1回复

如何在GSAP或Javascript中以不同的时间间隔调用函数?

我有一个非常基本的幻灯片,如下所示: HTML JS 如您所见,它仅显示每个图像3秒钟(stayTime),然后将其淡出。 假设我想将第一张图像保留8秒,第二张图像保留6.5秒,第三张图像保留3秒。 我的意思是,对于所有图像,stayTime都不相同。 如何在GSAP或Java
1回复

JQuery/GSAP-将多个元素彼此平行移动

我想要做的是:我想在页面的Y轴或X轴(底部和左侧边框)上生成框,并使它们彼此平行移动,直到它们离开屏幕为止,在这里我要删除它们。 到目前为止,这是我所做的: Codepen 。 我的问题是:如何通过使所有盒子彼此平行移动的方式,准确地找到正确的位置来对盒子进行动画处理? 而且,有没有
1回复

GSAP:一次管理多个补间和时间表

首先,我是GSAP的新手,请多多包涵。 我尽我所能描述我正在努力的事情。 为了制作SVG文件的动画,我开始研究GSAP。 我为SVG文件中的不同元素创建了多个补间。 一切正常,并且可以按预期进行动画处理。 由于我的SVG中有很多要进行动画处理的元素,因此我开始添加TimelineL