Relative position mismatch

[Tweenrookie]

b1.onPress = function () {
    TweenLite.to (cds, 3, {_y:"-500", ease:Power2.easeInOut} );
}

 

I am designing a presentation with a column of cds covers i want the user to skim through each time he/she clicks on button "b1".As you can see each image is 500 pxs away from the next. the problem is that if the user press button "b1" BEFORE the transition has completed, the tween is called again, and therefore a mismatch occurs. 

 

How can this be solved?

 

 

 

[jamiejefferson]

The simplest change would probably be to use absolute tweens instead. You can achieve a relative effect doing something like:

currentY = cds._y; // starting position of cds
yDif = -500;       // amount to 'relatively' adjust _y
b1.onPress = function() {
  TweenLite.to(cds, 3, {_y:(currentY += yDif), ease:Power2.easeInOut});
}

This should keep all _y values as a factor of 500 regardless of someone clicking through quickly. Also, if you need to go in reverse you can just use _y:(currentY -= yDif)
 
Alternatively, you could manage a currentItem index for which cover you are currently looking at, and use _y:(currentItem * yDif)