- TimelineMax 中文手册 / TimelineLite 中文手册
- TimelineMax()
- .add()
- .addCallback()
- .addLabel()
- .addPause()
- .remove()
- .removeCallBack()
- .removeLabel()
- .removePause()
- .to()
- .from()
- .fromTo()
- .staggerTo()
- .staggerFrom()
- .staggerFromTo()
- .set()
- delay
- paused
- useFrames
- tweens
- stagger
- align
- autoRemoveChildren
- smoothChildTiming
- repeat
- repeatDelay
- yoyo
- callbackScope
- onStart
- onStartParams
- onStartScope
- onComplete
- onCompleteParams
- onCompleteScope
- onReverseComplete
- onReverseCompleteParams
- onReverseCompleteScope
- onUpdate
- onUpdateParams
- onUpdateScope
- onRepeat
- onRepeatParams
- onRepeatScope
- .play()
- .pause()
- .paused()
- .restart()
- .resume()
- .reverse()
- .reversed()
- .seek()
- .timeScale()
- .tweenTo()
- .tweenFromTo()
- .delay()
- .repeat()
- .repeatDelay()
- .duration()
- .totalDuration()
- .progress()
- .totalProgress()
- .time()
- .totalTime()
- .endTime()
- .startTime()
- .yoyo()
- .autoRemoveChildren
- .data
- .smoothChildTiming
- .timeline
- .call()
- .clear()
- .currentLabel()
- .eventCallback()
- TimelineMax.exportRoot()
- .getActive()
- .getChildren()
- .getLabelAfter()
- .getLabelBefore()
- .getLabelsArray()
- .getLabelTime()
- .getTweensOf()
- .invalidate()
- .isActive()
- .kill()
- .recent()
- .shiftChildren()
文章来源于网络收集而来,版权归原创者所有,如有侵权请及时联系!
.totalDuration()
.totalDuration( value:Number ) : *
获取或设置总的时间轴持续时间
var total = myTimeline.totalDuration(); //获取总的时间轴持续时间
myTimeline.totalDuration(10); //设置总的时间轴持续时间
.totalDuration()适用于TimelineMaxTimelineLite
.totalDuration()的参数
参数 | 类型 | 必填 | 说明 |
---|---|---|---|
value | Number | 否 | 设置总的时间轴持续时间,留空则读取总的时间轴持续时间(default = NaN) |
.totalDuration() 示例
duration: 0 单次动画持续的时间
totalDuration: 0 全部重复动画加重复间隔的持续时间
repeat: 0 of 重复次数
repeatDelay: 0 每次重复动画的间隔
time: 1 时间
totalTime: 1 总时间
progress: 1 单次动画进程
totalProgress: 1 总进程
body {
background: #f8f8f8;
font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
font-size: 14px;
color: #000;
margin: 0 10px;
padding: 0;
}
.box {
width:50px;
height:50px;
border-radius:6px;
margin-top:4px;
display:inline-block
}
.green{
background-color:#6fb936;
}
#stats{
line-height:2;
margin-top:1em;
}
var tm = new TimelineMax({repeat: 3, repeatDelay:2, onUpdate:updateStats, onRepeat:updateReps, });
tm.to('.box', 3, {x: 500});
var duration = document.getElementById("duration"),
totalDuration = document.getElementById("totalDuration"),
repeatCount = document.getElementById("repeatCount"),
repeatDelay = document.getElementById("repeatDelay"),
totalRepeatCount = document.getElementById("totalRepeatCount"),
time = document.getElementById("time"),
totalTime = document.getElementById("totalTime"),
progress = document.getElementById("progress"),
totalProgress = document.getElementById("totalProgress"),
reps = 0;
function updateReps() {
reps++;
repeatCount.innerHTML = reps;
}
function updateStats() {
time.innerHTML = tm.time().toFixed(2);
totalTime.innerHTML = tm.totalTime().toFixed(2);
progress.innerHTML = tm.progress().toFixed(2);
totalProgress.innerHTML = tm.totalProgress().toFixed(2);
}
function reset() {
reps = 0;
duration.innerHTML = tm.duration().toFixed(2);
totalDuration.innerHTML = tm.totalDuration().toFixed(2);
repeatCount.innerHTML = reps;
repeatDelay.innerHTML = tm.repeatDelay().toFixed(2);
totalRepeatCount.innerHTML = tm.repeat();
}
reset();
.totalDuration()返回值
.totalDuration()的补充说明
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
![扫码二维码加入Web技术交流群](/public/img/jiaqun_03.jpg)
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论