暂停在Timeline Lite中不起作用

时间:2013-08-01 21:08:00

标签: tweenlite tweenmax timeline.js

我希望在每个项目滑动后,在我的div中逐个滑动每个元素。以下是我附上的代码     $(function(){

$('。tick')。each(function(){

var $ self = $(this);

var t1 = new TimelineLite();

t1.to($ self,.5,{x:100,ease:Cubic.easeInOut});

t1.pause();

t1.resume();

});'

它的作用是:它一次滑动所有项目。每个项目幻灯片后都不会暂停...代码中的问题是什么?

谢谢&的问候,

Bunnie

2 个答案:

答案 0 :(得分:0)

var delayTween = 0.1;   // your pause time in seconds
var tweenArr = [];

// I have put this line outside of each block because it will re insatiate t1 all the time, and we require to initialise it only once
var t1 = new TimelineLite();

$('.tick').each(function () {

    // var $self = $(this);     
    // there is no need to bind this to jquery object because tweenmax works well with "this" (html element)

    tweenArr.push(
        TweenMax.to(this,0.5,{x:100,ease:Cubic.easeInOut});
    );

});

t1.add(
    tweenArr,
    '+=0',
    "sequance",
    delayTween
);

答案 1 :(得分:0)

发生了什么事情,您正在呼叫pause(),然后紧接着呼叫resume()

您可以做的只是添加另一个to()补间,只需传递一个空的targetvars对象。然后将其duration设置为您想要的暂停时间。

// pause timeline for 5 seconds 
t1.to({}, 5, {});

另见:GreenSock Forum Topic - Inserting a pause delay wait into timeline

希望这有帮助! :)