onOverwrite

onOverwrite: Function
当一个补间动画被另外一个补间动画覆盖时发生的事件。

onOverwrite:function(overwrittenTween,overwritingTween,target,overwrittenProperties){
...
}
onOverwrite适用于TweenMaxTweenLite

onOverwrite的参数

onOverwrite可以传递以下参数。

参数 类型 说明
overwrittenTween Tween 被覆盖的补间动画
overwritingTween Tween 覆盖的补间动画
target Object 动画目标（只有"auto"模式才会传递此参数），与overwrittenTween.target类似
例如：TweenLite.to([obj1, obj2], 1, {x:100}) 和 TweenLite.to(obj2, 1, {x:50}), 目标应是 obj2
overwrittenProperties Array 一个属性数组，包含了被覆盖的动画属性（只有"auto"模式才会传递此参数），
例如：["x","y","opacity"]

onOverwrite效果展示

  • HTML
  • CSS
  • JS
  • 展示

  

  

  


.box {
    width:50px;
    height:50px;
    border-radius:6px;
    margin-top:4px;
  }
.green{
    background-color:#6fb936;
  }
.orange {
    background-color: #f38630;
}
.grey {
    background-color: #989898;
}
var myTween = TweenMax.to([".green",".orange"], 3, {
    x: 300,
    alpha: 0.2,
    onOverwrite:myFunction
})
var myTween2 = TweenMax.to([".orange",".grey"], 5, {
    x: 500,
    y: 100,
})

function myFunction(overwrittenTween,overwritingTween,target,overwrittenProperties){
    console.log(overwrittenTween);
    console.log(overwritingTween);
    console.log(target);
    console.log(overwrittenProperties);
}
重播

转载原创文章请注明：文章转载自：TweenMax中文网 [https://www.tweenmax.com.cn]
本文地址：https://www.tweenmax.com.cn/api/tweenmax/onOverwrite

TweenMax API