lastos
asked on
Flash Multi Level Horizontal Drop down Menu
I am trying to create a mulitlevel horizontal flash drop down menu. It's coming along but I have a few issues.
1) I would like the text in my Main Menu a different size(16) then the one in my sub menu(12).At present I had to make it 9 for all buttons so that i could fit all my text with some sub menus.
2) When I rollout the menu it doesn't dissapper until i either rollover anothe menu item or clik on an empty space.
3)I would like it to fit the stage width and not overlap
I have attached my fla code which is ont the main timelineon the first frame and pasted my xml file. Please assist
1) I would like the text in my Main Menu a different size(16) then the one in my sub menu(12).At present I had to make it 9 for all buttons so that i could fit all my text with some sub menus.
2) When I rollout the menu it doesn't dissapper until i either rollover anothe menu item or clik on an empty space.
3)I would like it to fit the stage width and not overlap
I have attached my fla code which is ont the main timelineon the first frame and pasted my xml file. Please assist
<?xml version="1.0" encoding="iso-8859-1" ?>
<navigation>
<menu name="HOME" href="/home/" />
<menu name="CORPORATE" href="/tutorials/">
<submenu name="Company Overview" href="/reviews/books/" />
<submenu name="BEE" href="/reviews/software/" />
<submenu name="Social Responsibility" href="/reviews/software/" />
</menu>
<menu name="SOLUTIONS" href="/reviews/">
<menu name="IT Strategy">
<menu name="Project And Portfolio Management">
<item name="PPM" action="gotoURL" variables="http://www.sortit.co.za"/>
</menu>
</menu>
<menu name="IT Application" href="/reviews/software/">
<menu name="Testing">
<item name="HP Quality Center" action="gotoURL" variables="http://www.sortit.co.za"/>
<item name="HP Performance Center" action="gotoURL" variables="http://www.sortit.co.za"/>
</menu>
</menu>
<menu name="IT Operations">
<menu name="Business Service Management">
<item name="HP Business Availabilty Center" action="gotoURL" variables="http://www.sortit.co.za"/>
</menu>
<menu name="Business Service Automation">
<item name="HP Business Service Automation" action="gotoURL" variables="http://www.sortit.co.za"/>
</menu>
<menu name="IT Service Management" >
<item name="HP Service Management" action="gotoURL" variables="http://www.sortit.co.za"/>
</menu>
<menu name="IT Asset Management">
<item name="HP Asset Manager" action="gotoURL" variables="http://www.sortit.co.za"/>
<item name="Altiris" action="gotoURL" variables="http://www.sortit.co.za"/>
</menu>
<menu name="IT Network Management">
<item name="HP Network Node Manager" action="gotoURL" variables="http://www.sortit.co.za"/>
</menu>
<menu name="IT Systems Management" >
<item name="HP Operations Manager" action="gotoURL" variables="http://www.sortit.co.za"/>
<item name="Altiris" action="gotoURL" variables="http://www.sortit.co.za"/>
</menu>
<menu name="IT Security Management">
<item name="Checkpoint" action="gotoURL" variables="http://www.sortit.co.za"/>
<item name="Websense" action="gotoURL" variables="http://www.sortit.co.za"/>
</menu>
</menu>
</menu>
<menu name="PARTNERS" href="/tutorials/">
</menu>
<menu name="CUSTOMERS" href="/tutorials/">
</menu>
<menu name="NEWS" href="/tutorials/">
</menu>
<menu name="CONTACT US" href="/tutorials/">
<submenu name="Employment" href="/reviews/books/" />
</menu>
</navigation>
Flash Code::
GenerateMenu = function (container, name, x, y, depth, node_xml)
{
var curr_node;
var curr_item;
var curr_menu = container.createEmptyMovieClip(name, depth);
var i = 0;
while (i < node_xml.childNodes.length)
{
curr_item = curr_menu.attachMovie("menuitem", "item" + i + "_mc", i);
curr_item._x = x + i * curr_item._width;
curr_item._y = y;
curr_item.trackAsMenu = true;
curr_node = node_xml.childNodes[i];
curr_item.action = curr_node.attributes.action;
curr_item.variables = curr_node.attributes.variables;
curr_item.name.text = curr_node.attributes.name;
if (node_xml.childNodes[i].nodeName == "menu")
{
curr_item.node_xml = curr_node;
curr_item.arrow._visible = false;
curr_item.onRollOver = curr_item.onDragOver = function ()
{
var x = this._x;
var y = this._y + this._height;
GenerateMenu1(curr_menu, "submenu_mc", x, y, 1000, this.node_xml);
var col = new Color(this.background);
col.setRGB(10066329);
};
}
else
{
curr_item.arrow._visible = false;
curr_item.onRollOver = curr_item.onDragOver = function ()
{
curr_menu.submenu_mc.removeMovieClip();
var col = new Color(this.background);
col.setRGB(10066329);
};
} // end else if
curr_item.onRollOut = curr_item.onDragOut = function ()
{
var col = new Color(this.background);
col.setTransform({ra: 100, rb: 0, ga: 100, gb: 0, ba: 100, bb: 0});
};
curr_item.onRelease = function ()
{
Actions[this.action](this.variables);
CloseSubmenus();
};
++i;
} // end while
};
CreateMainMenu = function (x, y, depth, menu_xml)
{
GenerateMenu(this, "mainmenu_mc", 0, 113, depth, menu_xml.firstChild);
mainmenu_mc.onMouseUp = function ()
{
if (mainmenu_mc.submenu_mc && !mainmenu_mc.hitTest(_root._xmouse, _root._ymouse, true))
{
CloseSubmenus();
} // end if
};
};
CloseSubmenus = function ()
{
mainmenu_mc.submenu_mc.removeMovieClip();
};
Actions = Object();
Actions.gotoURL = function (urlVar)
{
getURL(urlVar, "_blank");
};
Actions.message = function (msg)
{
message_txt.text = msg;
};
Actions.newMenu = function (menuxml)
{
menu_xml.load(menuxml);
};
menu_xml = new XML();
menu_xml.ignoreWhite = true;
menu_xml.onLoad = function (ok)
{
if (ok)
{
CreateMainMenu(10, 10, 0, this);
message_txt.text = "message area";
}
else
{
message_txt.text = "error: XML not successfully loaded";
} // end else if
};
menu_xml.load("menu1.xml");
GenerateMenu1 = function (container, name, x, y, depth, node_xml)
{
var curr_node;
var curr_item;
var curr_menu = container.createEmptyMovieClip(name, depth);
var i = 0;
while (i < node_xml.childNodes.length)
{
curr_item = curr_menu.attachMovie("menuitem", "item" + i + "_mc", i);
curr_item._x = x;
curr_item._y = y + i * curr_item._height;
curr_item.trackAsMenu = true;
curr_node = node_xml.childNodes[i];
curr_item.action = curr_node.attributes.action;
curr_item.variables = curr_node.attributes.variables;
curr_item.name.text = curr_node.attributes.name;
if (node_xml.childNodes[i].nodeName == "menu")
{
curr_item.arrow._rotation = 0;
curr_item.node_xml = curr_node;
curr_item.onRollOver = curr_item.onDragOver = function ()
{
var x = this._x + this._width - 5;
var y = this._y;
GenerateMenu2(curr_menu, "submenu_mc", x, y, 1000, this.node_xml);
var col = new Color(this.background);
col.setRGB(10066329);
};
}
else
{
curr_item.arrow._visible = false;
curr_item.onRollOver = curr_item.onDragOver = function ()
{
curr_menu.submenu_mc.removeMovieClip();
var col = new Color(this.background);
col.setRGB(10066329);
};
} // end else if
curr_item.onRollOut = curr_item.onDragOut = function ()
{
var col = new Color(this.background);
col.setTransform({ra: 100, rb: 0, ga: 100, gb: 0, ba: 100, bb: 0});
};
curr_item.onRelease = function ()
{
Actions[this.action](this.variables);
CloseSubmenus();
};
++i;
} // end while
};
GenerateMenu2 = function (container, name, x, y, depth, node_xml)
{
var curr_node;
var curr_item;
var curr_menu = container.createEmptyMovieClip(name, depth);
var i = 0;
while (i < node_xml.childNodes.length)
{
curr_item = curr_menu.attachMovie("menuitem", "item" + i + "_mc", i);
curr_item._x = x;
curr_item._y = y + i * curr_item._height;
curr_item.trackAsMenu = true;
curr_node = node_xml.childNodes[i];
curr_item.action = curr_node.attributes.action;
curr_item.variables = curr_node.attributes.variables;
curr_item.name.text = curr_node.attributes.name;
if (node_xml.childNodes[i].nodeName == "menu")
{
curr_item.arrow._rotation = 0;
curr_item.node_xml = curr_node;
curr_item.onRollOver = curr_item.onDragOver = function ()
{
var x = this._x + this._width - 5;
var y = this._y;
GenerateMenu3(curr_menu, "submenu_mc", x, y, 1000, this.node_xml);
var col = new Color(this.background);
col.setRGB(10066329);
};
}
else
{
curr_item.arrow._visible = false;
curr_item.onRollOver = curr_item.onDragOver = function ()
{
curr_menu.submenu_mc.removeMovieClip();
var col = new Color(this.background);
col.setRGB(10066329);
};
} // end else if
curr_item.onRollOut = curr_item.onDragOut = function ()
{
var col = new Color(this.background);
col.setTransform({ra: 100, rb: 0, ga: 100, gb: 0, ba: 100, bb: 0});
};
curr_item.onRelease = function ()
{
Actions[this.action](this.variables);
CloseSubmenus();
};
++i;
} // end while
};
GenerateMenu3 = function (container, name, x, y, depth, node_xml)
{
var curr_node;
var curr_item;
var curr_menu = container.createEmptyMovieClip(name, depth);
var i = 0;
while (i < node_xml.childNodes.length)
{
curr_item = curr_menu.attachMovie("menuitem", "item" + i + "_mc", i);
curr_item._x = x;
curr_item._y = y + i * curr_item._height;
curr_item.trackAsMenu = true;
curr_node = node_xml.childNodes[i];
curr_item.action = curr_node.attributes.action;
curr_item.variables = curr_node.attributes.variables;
curr_item.name.text = curr_node.attributes.name;
if (node_xml.childNodes[i].nodeName == "menu")
{
curr_item.arrow._rotation = 0;
curr_item.node_xml = curr_node;
curr_item.onRollOver = curr_item.onDragOver = function ()
{
var x = this._x;
var y = this._y;
GenerateMenu2(curr_menu, "submenu_mc", x, y, 1000, this.node_xml);
var col = new Color(this.background);
col.setRGB(10066329);
};
}
else
{
curr_item.arrow._visible = false;
curr_item.onRollOver = curr_item.onDragOver = function ()
{
curr_menu.submenu_mc.removeMovieClip();
var col = new Color(this.background);
col.setRGB(10066329);
};
} // end else if
curr_item.onRollOut = curr_item.onDragOut = function ()
{
var col = new Color(this.background);
col.setTransform({ra: 100, rb: 0, ga: 100, gb: 0, ba: 100, bb: 0});
};
curr_item.onRelease = function ()
{
Actions[this.action](this.variables);
CloseSubmenus();
};
++i;
} // end while
};
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
We are here to assist you with specific questions, but we (generally) do not provide working solutions from non-existant code.
You would be better served if you first determine 1) where you need help with code or syntax or whatever and 2) posting a specific question about getting things to work.
But you have to do the work first. We are not here to do that for you.