# AS3 Greensock tweening advice

**URL:** <https://forum.kirupa.com/t/as3-greensock-tweening-advice/304801>\
**Category:** flash\
**Created:** [February 14, 2010, 9:22am UTC](https://forum.kirupa.com/t/as3-greensock-tweening-advice/304801 "2010-02-14T09:22:52Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![maseintheplace](https://avatars.discourse-cdn.com/v4/letter/m/8e8cbc/32.png) [@maseintheplace](https://forum.kirupa.com/u/maseintheplace)\
**Post date:** [February 14, 2010, 9:22am UTC](https://forum.kirupa.com/t/as3-greensock-tweening-advice/304801/1 "2010-02-14T09:22:52Z")

</div>

Hi Guys,

I’ve created a funky little menu system… but! testing it in fullscreen mode & on certain slower machines the whole thing slows down & becomes very jerky.

If your mouse goes near the top of the screen the menu nudges down using an ENTER\_FRAME with a hit test, then if your mouse goes over the menu (again a hit test) - I use a tweenlite to animate the height of a mask, revealing the background of the menu. As this is happening I tweenlite several menu items & line graphics into the X position & fade them on with a variable delay so the all slide on individually.

I don’t know if I’m writing bad tweens for greensock or if its my code in general.

I’m just looking for some general advice on improving my code:

your help is much appriciated!! 🐇

```auto

//////////////////////////////
//// Menu Functions ////
//////////////////////////////
var menuOn:Boolean = false;

// ** Nudge them menu down when rolling over the top area
top.addEventListener(Event.ENTER_FRAME, topHitTest);
function topHitTest(e:Event):void {
    if(top.hitTestPoint(mouseX,mouseY,true)) {
//** just me being lazy here with 'isRollOve' quick fix to duplicate variable names!
        if (!this.isRollOve && welcomeState == false && menuOn == false) {
            this.isRollOve = true;
                TweenLite.to(menu, .7, {y:10});
        }
    } else {
        if (this.isRollOve && welcomeState == false && menuOn == false){
            this.isRollOve = false;
            TweenLite.to(menu, .7, {y:0});
        }
    }
}

// ** Showt the menu when mouse is over the red
menu.addEventListener(Event.ENTER_FRAME, menuHitTest);
function menuHitTest(e:Event):void {
    if(menu.hitTestPoint(mouseX,mouseY,true)) {
        if (!this.isRollOver) {
            this.isRollOver = true;
            menuOn = true;
            menuOver()
        }
    } else {
        if (this.isRollOver) {
            this.isRollOver = false;
            menuOn = false;
            menuOut()
        }
    }
}

function menuOver():void {
    menuOn = true;
    TweenLite.to(menu.arr, .5, {alpha:0});
    for (var i:int=0; i<xmlMenuLength; i++) {
        var delay:Number = i/15;
        TweenLite.to(menuItems*, .7, {x:0, alpha:1, delay:delay});
    }
    for (var j:int=0; j<xmlMenuLength-1; j++) {
        var delay2:Number = j/15;
        TweenLite.to(menuLines[j], .7, {x:0, delay:delay2});
    }
    TweenLite.to(menu.mask, 1, {height:menuHeight, ease:Cubic.easeOut});
    TweenLite.to(menu.red, .5, {alpha: 1, ease:Quart.easeIn});
}

function menuOut():void {
    TweenLite.to(menu.mask, .7, {height:40, ease:Cubic.easeInOut, onComplete: hideMenu});
    TweenLite.to(menu.red, .5, {alpha: .9, ease:Quart.easeIn});
}

function hideMenu():void {
    TweenLite.to(menu, 1, {y:0});
    TweenLite.to(menu.arr, .5, {alpha:1});
    for (var i:int=0; i<xmlMenuLength; i++) {
        menuItems*.alpha = 0;
        menuItems*.x = 300;
    }
    for (var j:int=0; j<xmlMenuLength-1; j++) {
        menuLines[j].x = -300;
    }
    
}

```

I’ve just been reading about ‘allTO’ tweens from greensock, but I need each item to have a varying delay. I’m not sure if allTo would allow me to do that and I understand you have to use tweenMax which is a it slower!?

Thanks again.

Mase.