.smoothChildTiming

.smoothChildTiming : Boolean
控制是否自动重新定位子动画/时间轴(更改其startTime),以便在动态更改属性时保持平滑播放。这些属性包括 reversed, timeScale, progress, totalProgress, time, totalTime, delay, pause, resume, duration, totalDuration
.smoothChildTiming适用于TimelineMaxTimelineLite

.smoothChildTiming效果展示

  • HTML
  • CSS
  • JS
  • 展示

不自动更改播放位置

.box {
    width:50px;
    height:50px;
    border-radius:6px;
    margin-top:4px;
  }
.green{
    background-color:#6fb936;
  }
#controls {
  position:absolute;
  width: 100%;
  bottom: 20px;
  text-align: center;
}

button {
  padding:10px;
  margin:0 5px;
}
var timeline = new TimelineMax();
timeline.smoothChildTiming = false;
var childTimeline = new TimelineMax();
childTimeline.to(".box", 5, {x:500})
timeline.add(childTimeline);
playBtn = document.getElementById("play");
playBtn.onclick = function(){
  childTimeline.play();
  //或childTimeline.timeScale(0.2);
}
reverseBtn = document.getElementById("reverse");
reverseBtn.onclick = function(){
  childTimeline.reverse();
  //或childTimeline.timeScale(0.5);
}
重播

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