如何在 TimelineMax (GSAP) 中播放后重置原始位置
How to reset original positions after playing in TimelineMax (GSAP)
我正在这样播放我的动画,
tl = new TimelineMax({paused:true});
tl.to(DOM_ELEMENT_TOP,1,{left:100},ease:Linear.easeIn);
tl.to(DOM_ELEMENT_BOTTOM,1,{top:100},ease:Linear.easeIn);
tl.play();
如何在动画播放完毕后将 DOM 元素重置到原来的位置?
我想在不反转动画本身的情况下执行此操作(很明显!)
您的代码中似乎有一些拼写错误 - 易用性属于 vars 对象:
tl.to(DOM_ELEMENT_TOP, 1, {left:100, ease:Linear.easeIn});
tl.to(DOM_ELEMENT_BOTTOM, 1, {top:100, ease:Linear.easeIn});
然后如果你想将事情恢复到它们开始的地方,你可以简单地跳到开头,例如:
tl.pause(0);
或者,如果你想从字面上清除内联 CSS 中的 top/left 属性,你可以这样做:
TweenLite.set(DOM_ELEMENT_TOP, {clearProps:"left"});
TweenLite.set(DOM_ELEMENT_BOTTOM, {clearProps:"top"});
我正在这样播放我的动画,
tl = new TimelineMax({paused:true});
tl.to(DOM_ELEMENT_TOP,1,{left:100},ease:Linear.easeIn);
tl.to(DOM_ELEMENT_BOTTOM,1,{top:100},ease:Linear.easeIn);
tl.play();
如何在动画播放完毕后将 DOM 元素重置到原来的位置?
我想在不反转动画本身的情况下执行此操作(很明显!)
您的代码中似乎有一些拼写错误 - 易用性属于 vars 对象:
tl.to(DOM_ELEMENT_TOP, 1, {left:100, ease:Linear.easeIn});
tl.to(DOM_ELEMENT_BOTTOM, 1, {top:100, ease:Linear.easeIn});
然后如果你想将事情恢复到它们开始的地方,你可以简单地跳到开头,例如:
tl.pause(0);
或者,如果你想从字面上清除内联 CSS 中的 top/left 属性,你可以这样做:
TweenLite.set(DOM_ELEMENT_TOP, {clearProps:"left"});
TweenLite.set(DOM_ELEMENT_BOTTOM, {clearProps:"top"});