GreenSock javascript动画与动态左答案

【问题标题】：GreenSock javascript animation with dynamic leftGreenSock javascript动画与动态左
【发布时间】：2015-02-04 08:45:10
【问题描述】：

我正在尝试在GreenSock 中创建相当复杂的动画，我真的需要持久化/动态左 css 动画，我尝试了几种方法，例如带偏移量的数组、函数（具有当前上下文）而不是值，但似乎它们没有不接受...

正如您稍后在小提琴中看到的，问题出在这部分代码中：

/** Switch items */
tl.to(elArray[left], 1, { left: elArray[right].offset().left });
tl.to(elArray[right], 1, { left: elArray[left].offset().left });

这是小提琴 http://jsfiddle.net/v4z3gm7q/4/ 的演示。它比我真正想要的要简单得多，但它很好地显示了问题。

【问题讨论】：

标签： javascript css gsap

【解决方案1】：

您应该将语法更改为

tl.to(elArray[left], 1, { css:{left: elArray[right].offset().left + "px" }});
tl.to(elArray[right], 1, { css:{left: elArray[left].offset().left + "px" });

当您对元素数组进行补间时，请使用 staggerTo like：

tl.staggerTo([elArray[left], elArray[right]], 0.4, { css:{top: "10px"} });

【讨论】：