Drop Down Menu

1

Hi,

I want to create a drop down menu but I do not no how to create the part so what when you move your mouse over the button a menu drops down.

can someone give me a tutorial on how to make one or point me to a tutorial to make one?

please

Jon.

2

I have an .fla of one that i made as practice, there’s probably an easier way than the one that i made but it at least works well. Have a look.

3

Thanks mate.

4

So how do you make the drop down menu appear front of another Fla. without having to increase the scene size.

5

Do you mean another .fla as in a .swf being loaded into a movie clip? If that’s the case, just put the movie clip that the .swf is being loaded into in a layer behind the dropdown menus. Or did i misunderstand your question?

6

What I have is two SWF,

one is the drop down menu and the other is PONG. I want the drop down menu above the game but when I move my mouse over the menu the drop down menu will not appear due to PONG!

regards

7

As long as the layer that your Pong .swf is being loaded into is under the layer that your dropdown menu is on, it should work alright. Since it’s a game though, it may have some crazy stuff going on with the z depths that it’s generating. I don’t have anything like that to test with.

8

Alrighty, if it didn’t work with your own graphics then you must have accidentally gotten rid of some of the original code. I’ll try to give you a simple explanation of how it works.

I started by making a movie clip, with the animation of what I wanted to happen when a person rolls over the menu. Here i made a tween with the subbuttons dropping down, and i masked what i didn’t want visible (what’s above the menu). I put a stop(); command in the first and last frames of the animation.

I then created an invisible button (which is a button with only something in its ‘hit’ state, sort of a hot spot) and i placed this button under the menu. I put this code on the invisible button:


on(rollOver){
	_root.forward = true;
	_root.reversal = false;
}

on(rollOut, dragOut){
	_root.forward = false;
	_root.reversal = true;
}

Then on the movie clip with the dropdown animation, i put this code:


onClipEvent(enterFrame){
	if(_root.forward){
		this.nextFrame();
	}
	
	if(_root.reversal){
		this.prevFrame();
	}
}

This will make the animation happen, but it won’t the dropdown menu stay when you move your mouse over it. So I solved this problem by placing another invisible button in the graphic that’s the subbutton menu. I put the same code on it that i put on the invisible button that triggers the animation. This keeps those variables as being ‘true’ so that it stays down. I then added buttons in with the dropdown graphic, and those can be actual real buttons. But you have to include the code that you’re putting on the invisible buttons also in the buttons that you put in the dropdown menu, once again to keep it down when you roll over them.

That’s as brief and simple as i could make it, hope it makes some sense.