我希望你们中的一些人使用过 tween.js(create.js 库套件的一部分)。
我有一个 JS Fiddle 向您展示我的问题:http: //jsfiddle.net/qyp8Y/1/
我在每个 8 步循环后看到一个暂停,这不应该存在。
有人可以看看它并告诉我我做错了什么吗?
谢谢!
我希望你们中的一些人使用过 tween.js(create.js 库套件的一部分)。
我有一个 JS Fiddle 向您展示我的问题:http: //jsfiddle.net/qyp8Y/1/
我在每个 8 步循环后看到一个暂停,这不应该存在。
有人可以看看它并告诉我我做错了什么吗?
谢谢!
当然,让我们逐步执行一些代码:
for (i = 0; i <= 8; i++) {
t.to({
rotation: 45 * i
}, 1000, Ease.elasticOut).wait(200);
}
以下是您在该循环中创建的值:
i : rotation
0 : 0
1 : 45
2 : 90
3 : 135
4 : 180
5 : 225
6 : 270
7 : 315
8 : 360
请注意,出于您的目的,0 和 360 是相同的值。这意味着当循环从头开始时,它会在一整秒内从 360 到 0(或无处)补间。
您的对象从旋转 0 开始,您无法摆脱到 360 的补间。但是,您可以通过从 45 的补间开始(从 1 开始)来删除到 0/360 的冗余补间
这种变化导致了这个(注意:我也改变了轻松,所以我可以更好地看到它):
for (i = 1; i <= 8; i++) {
t.to({
rotation: 45 * i
}, 1000, Ease.quadInOut).wait(200);
}
当然,接下来要解决的问题是如何让齿轮旋转,但又不会失去正确的光照/阴影方向。我会把它留给你。
更新:我通过您提交的 github 问题找到了这个。