Tween Class / onMotionFinished Problem

Hey all, hopefully someone can help me out with this problem that I have been having today…

I am currently creating a menu system for a site, that when hovered over expands from a short strip into the larger menu containing buttons/graphics etc.

To reduce the number of frames used within the site, i am trying to achieve this method using the tween class / onMotionFinished action as opposed to having a movieclip which plays through when hovered over.

However if you move the mouse off before the “loading in” animation is complete, it begins the “reverse” animation and seperate titles both appear on top of eachother.

Basically i need to stop the tweens from playing, should the user hover away before they are complete, like a movieclip would “rewind” if you were using that well documented method.

Below is the script, and I have attached the .fla for you to have a look at.

Any help would be greatly appreciated - thank you in advance if you are able to help! :slight_smile:


 
// import classes
import mx.transitions.Tween;
import mx.transitions.easing.*;
stop()
this.onRollOver = function(){
 
 var menu_expand:Tween = new Tween(_root.main_menu.menu_background,"_height",Elastic.easeOut,23,69,1,true);
 
 var text_rollOut:Tween = new Tween(_root.main_menu.menu_text,"_y",Strong.easeIn,0,-11,0.5,true);
 var text_fadeOut:Tween = new Tween(_root.main_menu.menu_text,"_alpha",Strong.easeIn,100,0,0.5,true)
 
 text_rollOut.onMotionFinished = function(){
 
  var name_rollIn:Tween = new Tween(_root.main_menu.laimonas_text,"_y",Strong.easeOut,11,0,0.5,true);
  var name_fadeIn:Tween = new Tween(_root.main_menu.laimonas_text,"_alpha",Strong.easeOut,0,100,0.5,true);
 
 }
 
}
this.onRollOut = function(){
 
 var menu_shrink:Tween = new Tween(_root.main_menu.menu_background,"_height",Strong.easeOut,69,23,1,true);
 
 var name_rollOut:Tween = new Tween(_root.main_menu.laimonas_text,"_y",Strong.easeIn,0,11,0.5,true);
 var name_fadeOut:Tween = new Tween(_root.main_menu.laimonas_text,"_alpha",Strong.easeIn,100,0,0.5,true);
 
 name_rollOut.onMotionFinished = function(){
 
  var text_rollIn:Tween = new Tween(_root.main_menu.menu_text,"_y",Strong.easeOut,-11,0,0.5,true);
  var text_fadeIn:Tween = new Tween(_root.main_menu.menu_text,"_alpha",Strong.easeOut,0,100,0.5,true);
 
 }
 
}