哟哟(yoyo)
哟哟(yoyo)(值:布尔):[布尔 | 自身]
获取或设置时间轴的往返状态,true 会使时间轴来回播放,在每次重复时交替向前和向后。
参数
值:布尔值
(默认值 =
false
) - 如果省略参数,则返回当前值(getter);如果提供参数,则设置值(setter),并返回实例自身以方便链式调用。
返回值:[布尔值 | 自身]
省略参数将返回当前值(getter),而定义参数将设置值(setter)并返回实例本身以便于链式调用。
细节
获取或设置时间轴的yoyo
状态,其中true
使时间轴来回播放,在每次重复时交替反向和正向播放。yoyo
与repeat
配合使用,repeat
控制时间轴重复的次数,而yoyo
控制每次重复是否交替方向。因此,要让一个时间轴实现来回播放效果,yoyo
你必须设置它的repeat
属性值为非零值。
来回播放(Yoyo)对时间轴的reversed
属性没有影响。例如,如果repeat
是 2 并且yoyo
设置为false
,看起来就像:起点 - 1 - 2 - 3 - 1 - 2 - 3 - 1 - 2 - 3 - 终点。但如果设置为yoyo
设置为true
,看起来就像:起点 - 1 - 2 - 3 - 3 - 2 - 1 - 1 - 2 - 3 - 终点。
你可以通过传递yoyo
属性初始传入时yoyo: true
在vars
参数设置初始重复值,例如:gsap.timeline({repeat: 1, yoyo: true});
此方法同时具备 getter 和 setter 的功能。省略参数时返回当前值(getter),而传入参数时则设置值(setter)并返回实例自身以便于链式调用,例如:myTimeline.yoyo(true).repeat(3).timeScale(2).play(0.5);
//gets current yoyo state
var yoyo = tl.yoyo();
//sets yoyo to true
tl.yoyo(true);