HELP PLEASE!

[WilliamWatt]

I have tried making a drop down menu in both AS 2.0 and 3.0 and I get the same problem every time. I program it correctly so the drop down menu does what I want it to do, which is to drop down when you roll over the button, then retract once you mouseOut over the the hit button, however when you move the mouse too quickly away sometimes the drop down menu will stay open instead of retracting like it is supposed to do. I was wondering if there is some function or program that I can input that would be if the mouse is no longer over the menu area, that the menu will retract. I am open to any suggestion because I am a beginner in flash, and anything would help. Thank you in advance to whoever can help me!

[kglad]

you can trigger a loop (like enterframe) on mouseover that checks for a hittest between your menu and the mouse.  if negative, roll-up the menu and terminate the loop.

[WilliamWatt]

Thank you kglad, that is I think what I am looking for! Do you know by chance exactly how I would program that in AS 3.0?

[kglad]

menu.addEventListener(MouseEvent.MOUSE_OVER,overF);

function overF(e:MouseEvent):void{

//expand menu

this.addEventListener(Event.ENTER_FRAME,loopF);

}

function loopF(e:Event):void{

if(!menu.hitTestPoint(mouseX,mouseY,true)){

//contract menu

this.removeEventListener(Event.ENTER_FRAME,loopF);

}

}

[WilliamWatt]

Hello kglad,

Thank you so much for all your help! So I tried to add your code into my program, and it didn't do anything. Perhaps I am not implementing it correctly. Here is what I have so far:

import fl.transitions.Tween;

import fl.transitions.easing.Regular;

import fl.transitions.easing.Elastic;

import flash.events.MouseEvent;

stop();

menu_cont.about_rect.alpha = 0;

menu_cont.about_btn.addEventListener(MouseEvent.ROLL_OVER, aboutRollOver);

menu_cont.about_rect.addEventListener(MouseEvent.MOUSE_OUT, aboutMouseOut);

function aboutRollOver (event:MouseEvent):void {

    var aboutMenuTween = new Tween(menu_cont.about_menu, "y", Regular.easeOut, menu_cont.about_menu.y, 2.5, .5, true);

}

function aboutMouseOut (event:MouseEvent):void {

    var aboutMenuTween2 = new Tween(menu_cont.about_menu, "y", Regular.easeOut, menu_cont.about_menu.y, -147.5, .5, true);

}

Then I added yours such as

menu_cont.about_btn.addEventListener(MouseEvent.MOUSE_OVER,overF);

function overF(e:MouseEvent):void{

//expand menu

this.addEventListener(Event.ENTER_FRAME,loopF);

}

function loopF(e:Event):void{

if(!menu_cont.about_btn.hitTestPoint(mouseX,mouseY,true)){

//contract menu

this.removeEventListener(Event.ENTER_FRAME,loopF);

}

}

I have even tried to enter about_rect instead of about_btn, and still it does the same thing. There are no errors when I add your code, but the swf seems the same with or without your code, and the menu bar stays dropped down sometimes when you scroll off of it too quickly. Do you know what the problem could be? Am I still doing something incorrectly?

[kglad]

no, use:

import fl.transitions.Tween;

import fl.transitions.easing.Regular;

import fl.transitions.easing.Elastic;

import flash.events.MouseEvent;

stop();

menu_cont.about_rect.alpha = 0;

menu_cont.about_btn.addEventListener(MouseEvent.ROLL_OVER, aboutRollOver);

var tween:Tween;

function aboutRollOver (event:MouseEvent):void {

tween = new Tween(menu_cont.about_menu, "y", Regular.easeOut, menu_cont.about_menu.y, 2.5, .5, true);

this.addEventListener(Event.ENTER_FRAME,loopF);

}

function loopF(e:Event):void{

if(!menu_cont.about_btn.hitTestPoint(mouseX,mouseY,true)){

this.removeEventListener(Event.ENTER_FRAME,loopF);

aboutMouseOut();

}

}

function aboutMouseOut ():void {

tween = new Tween(menu_cont.about_menu, "y", Regular.easeOut, menu_cont.about_menu.y, -147.5, .5, true);

}

[WilliamWatt]

Thank you so much for all your help kglad! This is almost exactly what I need! When I input your code though, if I scrolled anywhere except for the about_btn the drop down menu went away. I need it to do this function, but instead of having the button be the isolated area, would it be possible to make the about_menu do that instead? I tried to change the name of !menu_cont.about_btn to !menu_cont.about_menu but it did something weird, and it didn't quite work out correctly. Is there something else I could change in the code to make it so the drop down menu is the one recieving the hitTest?

[kglad]

rolling over what object should trigger the expansion of your menu?  add the rollover listener to that object.

rolling off what should trigger the contraction of your menu?  use that object in the hittest.

[WilliamWatt]

OK, so I tried to apply what you have told me about determining which item should go into which function, and the only problem that I have now is it does something when I try to make the about_btn both the trigger for the drop down menu as well as the object that should trigger the contraction for the hittest. The reason why it needs to be like this is because it needs to trigger the drop down menu, but also if the person is still mousing over this button, then it needs to stay open. Is there anyway to create this effect and still have the animation run smoothly? Because when I try to do it now, it does something weird, and it doesn't get the effect that I want. I truly appreciate all of your help kglad, I could not have come this far without you

[kglad]

almost certainly you do NOT want the contraction to be triggered by a rollout of the about_btn.  normally, after the expansion, as long as the mouse is over the about_btn OR the expanded menu, the expansion should remain.

[WilliamWatt]

You are right, I do not want the contractraction to be on the about_btn, but when I programmed it using the recommendation you gave me, when the mouse leaves the about_menu, the menu contractacts upwards, which is great and thats what I need. However the about button that triggers the about menu is on a layer above the about menu, if you could imagine a rectangle inside of a box towards the top. So when the menu is triggered the menu comes out, but then if you roll over the button (which is no part of the menu) the menu goes away. Is there anyway to get rid of this problem? Do I have to add an additional function?

[kglad · Accepted solution]

just add both the btn and menu to the hittest:

import fl.transitions.Tween;

import fl.transitions.easing.Regular;

import fl.transitions.easing.Elastic;

import flash.events.MouseEvent;

stop();

menu_cont.about_rect.alpha = 0;

menu_cont.about_btn.addEventListener(MouseEvent.ROLL_OVER, aboutRollOver);

var tween:Tween;

function aboutRollOver (event:MouseEvent):void {

tween = new Tween(menu_cont.about_menu, "y", Regular.easeOut, menu_cont.about_menu.y, 2.5, .5, true);

this.addEventListener(Event.ENTER_FRAME,loopF);

}

function loopF(e:Event):void{

if(!menu_cont.about_btn.hitTestPoint(mouseX,mouseY,true) && !about_btn.hitTestPoint(mouseX,mouseY)){

this.removeEventListener(Event.ENTER_FRAME,loopF);

aboutMouseOut();

}

}

function aboutMouseOut ():void {

tween = new Tween(menu_cont.about_menu, "y", Regular.easeOut, menu_cont.about_menu.y, -147.5, .5, true);

}