yx_menu (Generation 2) Copyright 2000 Xin Yang All Rights Reserved.
Features:
Versions:
Some terms used in G2:
Usage:
function buildMenu() { addStyle(...); addStyle(...); ... addInstance(...); addInstance(...); ... addFrame(...); }- see syntax for "addStyle()", "addInstance()" and "addFrame()" below
<script language="javascript" src="yx_menuG2-fs.js"></script> <script language="javascript" src="your_content_script.js"></script>(2) ... and embed the following codes in the top level <frameset> tag
onload="initGroup('groupArray')" ... groupArray is the name of the array variable which defines the menu groups in your content script(3) to use menus in a <frame> html file, include the following two lines within the "<head>...</head>" tags in that file ...
<script language="javascript" src="yx_menuG2-f.js"></script> <script language="javascript" src="your_control_script.js"></script>(4) ... and embed the following codes in the <body> tag
onload="initMenu(X)" ... set X to 0 if the frame scrolling property is set to "no", otherwise, set X to 1
<script language="javascript" src="yx_menuG2-nf.js"></script> <script language="javascript" src="your_content_script.js"></script> <script language="javascript" src="your_control_script.js"></script>(2) ... and embed the following codes in the <body> tag
onload="initGroup('groupArray')" ... groupArray is the name of the array variable which defines the menu groups in your content script
Syntax for menu items:
Syntax for menus:
Syntax for menu group:
Syntax for menu content:
Menu content sample:
var sample = new Array(); // the menu group array sample[0] = new Array("sample1","sample1","30"); // a menu group named "sample1", it's top level menu is defined by the same named array var sample1 = new Array(); // the top level menu array sample1[0] = new Array("iM", "", "This is Menu-A", "#", "sample11", "95", "0", "Menu-A0r.gif", "Menu-A1r.gif", "30", "90"); // a menu item sample1[1] = new Array("iM", "", "This is Menu-B", "#", "sample12", "95", "0", "Menu-B0r.gif", "Menu-B1r.gif", "30", "90"); sample1[2] = new Array("iM", "", "This is Menu-C", "#", "sample13", "95", "0", "Menu-C0r.gif", "Menu-C1r.gif", "30", "90"); var sample11 = new Array(); // the submenu array sample11[0] = new Array("M", "submenu A-1", "This is submenu A-1", "#", "sample111","105",""); sample11[1] = new Array("M", "submenu A-2", "This is submenu A-2", "#", "sample112","105",""); sample11[2] = new Array("M", "submenu A-3", "This is submenu A-3", "#", "sample113","105",""); sample11[3] = new Array("S"); sample11[4] = new Array("L", "LinkItem A-4", "This is link item A-4", "#", "", ""); sample11[5] = new Array("L", "LinkItem A-5", "This is link item A-5", "#", "", ""); var sample111 = new Array(); // one level deeper sample111[0] = new Array("M", "submenu A-1-1", "This is submenu A-1-1", "#", "sample1111","120",""); sample111[1] = new Array("M", "submenu A-1-2", "This is submenu A-1-2", "#", "sample1112","120",""); sample111[2] = new Array("S"); sample111[3] = new Array("L", "LinkItem A-1-3", "This is link item A-1-3", "#", "", "");
Syntax for menu style:
Menu style sample:
addStyle("style1",0,0,0,"#ffffff","#ffffff","#cc0000",0,"#6699cc","#003366","verdana,arial",12,"bold","none","#ffffff",0,7,7,"tag2r.gif","sample1/",100); addStyle("style2",6,1,2,"#336699","#336699","#cc0000",1,"#6699cc","#003366","verdana,arial",12,"bold","none","#ffffff",1,7,7,"tag2r.gif","sample1/",100);
Syntax for menu instance:
6,1,2,"#cccccc","#cccccc","#ffffff",1,"#f8f8f8","#666666","verdana,arial",14,"normal","none","#000000",1,7,7,"tag1r.gif","tags/",100
Menu instance sample:
addInstance("Menu ABC",0,0,"",0,10,0,0,1,"","sample1","style1","style2");
Syntax for menu frame:
Menu frame sample:
addFrame("Main");
Syntax for user functions:
<area ... href="javascript:openMap('frameName', 'instanceName')"> ... client site map <a href="javascript:openMap('frameName', 'instanceName')"></a> ... link
User functions sample(sample 6):
var sample = new Array(); // the group array sample[0] = new Array("sampleA","sampleA","100"); ... var sampleA = new Array(); // the menu array sampleA[0] = new Array("C", "Menu A", "This is Menu A", "clickMenu('Menu A')", "focusMenu('Menu A')", "blurMenu('Menu A')");
var menuXOffset=150,frameName="Nav",menuName=new Array("Menu A", ...),subName=new Array(...); var menuCount=4,subHeights=new Array(...),menuOn=new Array(...); var _isIE4x=(navigator.appVersion.indexOf("MSIE 4")==-1)?false:true; ... IE4x is not suitable to move menu instances in this sample function focusMenu(_name) { if (!_isIE4x) { moveMenuBy(frameName,_name,3,0); } // shift the menu } function blurMenu(_name) { if (!_isIE4x) { moveMenuBy(frameName,_name,-3,0); } // shift back the menu } function clickMenu(_name) { for (var i=0; i<menuCount; i++) { if (menuName[i]==_name) { menuOn[i]=!menuOn[i]; if (menuOn[i]) { for (var j=menuCount-1; j>i; j--) { moveMenuBy(frameName,subName[j],0,subHeights[i]); // move down the submenu moveMenuBy(frameName,menuName[j],0,subHeights[i]); // move down the top-level menu } moveMenuBy(frameName,subName[i],menuXOffset,0); // move in the submenu } else { moveMenuBy(frameName,subName[i],-menuXOffset,0); // move out the submenu for (var j=i+1; j<menuCount; j++) { moveMenuBy(frameName,menuName[j],0,-subHeights[i]); // move up the top-level menu moveMenuBy(frameName,subName[j],0,-subHeights[i]); // move up the submenu } } } } } function buildMenu() { ... if (_isIE4x) { addStyle(...); // set colorNormal and colorHighlighted to different colors } else { addStyle(...); // set colorNormal and colorHighlighted to the same color } ... addFrame("Nav"); }
The End