Jump to content

Search In
  • More options...
Find results that contain...
Find results in...

Multiple tweens one button [SOLVED]

Recommended Posts


How would I go about tweening an image more then once on the same button?

I have one button and on the first click it tweens the image to x:100.

The second time I press the button it takes the image and tween in from wherever it is to x:200, third time 300.

How would I do this?




Link to comment
Share on other sites

There are many ways you could do this. Here are a few:


1) If you just want it to keep moving 100 pixels more each time you click the button, just use a relative value like this:


function onButtonClick(event:MouseEvent):void {
   TweenLite.to(mc, 1, {x:"100"});


If you want to make the destination value increment 100 pixels each time, you'll need to track that like:


var xDest:Number = mc.x:
function onButtonClick(event:MouseEvent):void {
   xDest += 100;
   TweenLite.to(mc, 1, {x:xDest});


2) If the destination values are not equal values apart, you could store them in an Array and increment through them like:


var positions:Array = [0, 100, 200, 250, 425];
var curPosition:uint = 0;
function onButtonClick(event:MouseEvent):void {
   curPosition = (curPosition + 1) % positions.length;
   TweenLite.to(mc, 1, {x:positions[curPosition]});


3) You could create a TimelineMax and put all the tweens one-after-the-other with a label at each spot, and then use tweenTo() and getLabelAfter() together to step through the sequence.


Just a few off the top of my head :)

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.