.call()
优质
小牛编辑
127浏览
2023-12-01
.call( callback:Function, params:Array, scope:*, position:* ) : *
在时间轴的末尾（或position位置）增加一个回调函数，作用类似于add( TweenLite.delayedCall(...) ) ，以下代码效果大致相同：
myTimeline.add( TweenLite.delayedCall(0, myFunction, ["param1", "param2"]) );
myTimeline.call(myFunction, ["param1", "param2"]);
call与onComplete的区别在于，onComplete会在时间轴全部完成后触发，而call会在设定时的时间轴末端触发。
例如你的时间轴长为1秒，那么call设置的函数会在1秒时触发。这时你增加了一个1秒的动画使时间轴变成了2秒，call函数还是在1秒时触发，而onComplete则会在2秒时触发。
使用position设置函数触发时间点：
tl.call(func, ["param1"]); //添加到时间轴末端
tl.call(func, ["param1"], this, 2); //添加到时间轴2秒处(绝对位置)
tl.call(func, ["param1"], this, "+=2"); //添加到时间轴后2秒处(相对位置)
tl.call(func, ["param1"], this, "myLabel"); //添加至标签"myLabel"处
tl.call(func, ["param1"], this, "myLabel+=2"); //添加至标签"myLabel"后2秒处.call()适用于TimelineMaxTimelineLite
.call()的参数
| 参数 | 类型 | 必填 | 说明 |
|---|---|---|---|
| callback | Function | 是 | 要执行的函数 |
| params | Array | 否 | 传递回调的参数数组。default = null |
| scope | * | 否 | 回调调用的范围（基本上代表函数中"this"指的是什么），default = null |
| position | * | 否 | 插入回调函数的位置。秒或帧或标签，默认为"+=0" 。例如： |
.call() 示例
.box {
width:50px;
height:50px;
border-radius:6px;
margin-top:4px;
}
.green{
background-color:#6fb936;
}var tm = new TimelineMax();
tm.to(".box", 5, {x: 500}).call(myFunction, null, this, "-=4");
panel= document.getElementById("panel");
function myFunction(){
panel.innerHTML='函数触发了！';
}