/**
* CLASS MPG_DropMenu
* @Purpose creates a folding menu system which can be used within a table
* or layer structure independent of where it sits on the screen. This object
* is able to handle sticky select, mouseOver/Off, and submenus
* @Author Scott McDonald
* @Version 1.0
* @dependencies MM_findObj v3 or greater
* @Usage: [SEE BOTTOM FOR A TEMPLET]
declair an instance of the object inside your HTML at any point within the code.
the object does not depend on the existance of the menu HTML to be created.
to declair:
var dropmenu = new MPG_DropMenu
Adding Items to HTML part of menu
[Note: the format used (each item on it's own line) is the authors
preferred style of coding and is not required for object to work]
create your links, containing a common keyword and the following list of identifiers
[example will use the link name/id "Order"]
[keyword]Link:
NOTE: notice that the arguments are all the same. you can copy and paste the
events to each of your menu options without having to change anything
[keyword]Img
NOTE: if there is an alt tag, that will be displayed in the Status Bar of the window
[keyword]Output
NOTE: the span must be empty, unless you wish there to be content when the page
is loaded. this content will be replaced when the menu is opened but will be returned
when the menu is closed.
[keyword]Content
....HTML....
NOTE: the style needs to be set as seen here. to ensure that the content is not
visible, or affecting the layout in anyway, until being used.
RESOURCES REQUIRED
If the menu item is an image (if you don't use an image, there will be no rollover
affect) the folder which contains the image [in this case order.gif"] must contain
the over state image named with _over before the extention:
e.g.
order.gif & order_over.gif
[later implamentations may include a _open image option, if desired.]
ADDING MENU ITEMS
AFTER all HTML is defined, you can add each other the menu items to
the object. if you do it before you've added the HTML, you will get errors.
to add the menus simply pass the keyword in obj.addMenu(keyword)
e.g.
dropmenu.addMenu('Home');
dropmenu.addMenu('Order');
dropmenu.addMenu('Catalog');
Keyword IS CASE SENSITIVE
addMenu does not have to happen in order that menus appear.
PUBLIC PROPERTIES
NONE
PUBLIC METHODS
NOTE: unless for some reason you are calling the function for another
object, the argument to most methods will be the word "this"
o.trigger(this)
called onClick (or programatically) this will cause the selected
link to become the active menu option. closing all other menues
this is not needed on menu items which are simply links to take the
browser to a new page
o.onMouseOver(this) // triggers mouseover image swap
o.onMouseOut(this) // triggers mouseout image swap
o.holdRollOver(keyword as string)
called on the onLoad of the page, this will set a specified menu item
as sticky, which will mean that it stays selected regardless of selections
or mouse movement in the menu. the passed argument is the menu items KEYWORD
[ in the example, this would be "Order"] as a string.
o.report()
simply tells each menu item to report what information they have
this is a diagnostic tool, and will not likely be used in production site
*/
/*
*/
function MPG_DropMenu(){
if(MM_findObj == undefined){
alert("You must load MM_findObj before initializing this script");
}
/*
* Class Properties
*/
this.items = new Array();
/*
* Class Methods
*/
this.addMenu = MPG_DropMenu_AddMenu
this.close = MPG_DropMenu_Close;
this.getByLink = MPG_DropMenu_GetItemByLinkObj;
this.getByName = MPG_DropMenu_GetItemByName;
this.holdRollOver = MPG_DropMenu_HoldRollOver;
this.onMouseOut = MPG_DropMenu_onMouseOut;
this.onMouseOver = MPG_DropMenu_onMouseOver;
this.open = MPG_DropMenu_Open;
this.trigger = MPG_DropMenu_Trigger;
this.report = function(_return){
var $report = "";
for(var i=0;i will return the object assigned to it
*
* @returns Object
* @param $obj as Object
*/ function MPG_DropMenu_GetItemByLinkObj($obj){
for(var i=0;i
