View Full Version : Help with a Flash SubMenu
Mark__G
04-04-2008, 12:39 AM
So I have an existing flash menu and want to just add a submenu under two of the navigation buttons.
I just cant figure out how to achieve exactly what i want with the submenu function. I need the submenu when hovered over to activate obviously the submenu tween and on roll out the menu to tween out.
But the part that is becoming confusing for me is when the submenu button is clicked I want the navigation button at the top to stay in roll over state (IE. Selected) but just the submenu tween to tween out, and the roll over of the submenu tween to still be able to be activated.
Here is the existing actionscript on the menu buttons:
on (rollOver) {
if (_root.link<>page) {
gotoAndPlay("s1");
}
}
on (releaseOutside, rollOut) {
if (_root.link<>page) {
gotoAndPlay("s5");
}
if (_root.link=page) {
gotoAndStop("s3");
}
}
on (release) {
if (_root.link<>page && _root.G<>1) {
_root.G = 1;
_parent["item"+_root.link].gotoAndPlay("s2");
_root.link = page;
_root.play();
}
}
This obviously works to make it so if the page number which is set on a separate layer equals the link the rollout (s2) tween is not played so it stays selected when that is the page they are on.
My idea was to create my submenu tween and label it s2 and then where just the main navigation button tweens out label as s3, and also label the frame right before the submenu tweens down as s4. Am I approaching this right because it does not feel right.
Mark__G
04-04-2008, 12:43 AM
Woops sorry here is the AS of the existing buttons, the above AS was from what I had edited...
on (rollOver) {
if (_root.link<>page) {
gotoAndPlay("s1");
}
}
on (releaseOutside, rollOut) {
if (_root.link<>page) {
gotoAndPlay("s2");
}
}
on (release) {
if (_root.link<>page && _root.G<>1) {
_root.G = 1;
_parent["item"+_root.link].gotoAndPlay("s2");
_root.link = page;
_root.play();
}
}
Medyman
04-04-2008, 03:19 AM
There are two ways to do this.
First, with your current setup, you could create a whole another set of over/out animations. 1 set for when that page is selected and another for when it's not.
Secondly, and the way I would choose to do it is to move all the AS onto a frame so that you can control do more complex actions. Then you would have a separate movieclip for the actual button (in the menu) and a separate movieclip for the menu that comes down.
This shouldn't be too hard to do with your existing structure assuming you have it set up properly. This would then allow you to control the states of both movieclips independently -- allowing you to tell the submenu to collapse but the top menu to remain in it's "selected" state.
Mark__G
04-04-2008, 05:32 PM
I am following this somewhat but a little lost in how I would go about writing the AS for what I need achieved. I think I am going to go for the 2nd option and use AS in a frame and just give my moviescripts instance names.
Would it be possible to give me a quick example of the AS for the main button instance to play the s1 animation on roll over and s2 on out except when the page = link, and for the submenu to always play the s1 animation on the main button rollover even when selected and always play the s2 on roll out, but the tricky part is on all submenu pages I need to somehow make the main button stay selected.
Medyman
04-04-2008, 11:11 PM
This isn't how I would write the actionscript but it might be easier to understand this way. For example, I wouldn't set each menu item equal an onRollOver, onRollOut, and onRelease function individually. I would loop them through either a for loop or add them to arrays and use a foreach loop.
AS
/* Global Variables */
var down:Boolean = new Boolean(); // Stores if the menu is down
/* Over & Out */
function over() {
this.gotoAndStop("selected"); // Switches selected menu item to "selected" state
}
function out() {
this.gotoAndStop("unselected"); // Swithces menu back to "unselected" state
}
/* Menu Drop & Up */
function menuDown() {
if (this._parent.down != true) { // if down variable is false (i.e. menu is up) or not set
this._parent.gotoAndPlay("in"); // Moves mask down to expose submenu items
delete this.onRollOut; // Delete onRollOut so that mouse events don't change it
this._parent.down = true; // Menu is down
}
else {
trace ("Menu is already down"); // The menu is already done. Stop clicking so much :)
}
}
function menuUp() {
this._parent.gotoAndPlay("out"); // Moves mask down to expose submenu items
this._parent.down = false; // Menu is up
}
/* Deselect top menus */
function deSelect() {
this._parent.gotoAndStop("unselected"); // Moves top menu item to "unselected" state
}
/* Set top level items */
menuItem1.topLevel.onRollOver = over; menuItem2.topLevel.onRollOver = over; // set top level onRollOver
menuItem1.topLevel.onRollOut = out; menuItem2.topLevel.onRollOut = out; // set top level onRollOut
menuItem1.topLevel.onRelease = menuDown; menuItem2.topLevel.onRelease = menuDown; // set top level onRelease
/* Set submenus */
menuItem1.subMenu1.onRollOver = over; menuItem1.subMenu2.onRollOver = over; menuItem1.subMenu3.onRollOver = over; menuItem1.subMenu4.onRollOver = over; menuItem1.subMenu5.onRollOver = over; // set submenu onRollOver
menuItem2.subMenu1.onRollOver = over; menuItem2.subMenu2.onRollOver = over; menuItem2.subMenu3.onRollOver = over; menuItem2.subMenu4.onRollOver = over; menuItem2.subMenu5.onRollOver = over; // set submenu onRollOver
menuItem1.subMenu1.onRollOut = out; menuItem1.subMenu2.onRollOut = out; menuItem1.subMenu3.onRollOut = out; menuItem1.subMenu4.onRollOut = out; menuItem1.subMenu5.onRollOut = out; // set submenu onRollOut
menuItem2.subMenu1.onRollOut = out; menuItem2.subMenu2.onRollOut = out; menuItem2.subMenu3.onRollOut = out; menuItem2.subMenu4.onRollOut = out; menuItem2.subMenu5.onRollOut = out; // set submenu onRollOut
menuItem1.subMenu1.onRelease = menuUp; menuItem1.subMenu2.onRelease = menuUp; menuItem1.subMenu3.onRelease = menuUp; menuItem1.subMenu4.onRelease = menuUp; menuItem1.subMenu5.onRelease = menuUp; // set submenu onRelease
menuItem2.subMenu1.onRelease = menuUp; menuItem2.subMenu2.onRelease = menuUp; menuItem2.subMenu3.onRelease = menuUp; menuItem2.subMenu4.onRelease = menuUp; menuItem2.subMenu5.onRelease = menuUp; // set submenu onRelease
Flash 8 AS 2.0 File (http://www.mediafire.com/?tx19hbdoyiy)
Powered by vBulletin® Version 4.2.2 Copyright © 2021 vBulletin Solutions, Inc. All rights reserved.