Industrial Strength JavaScript and DHTML Menus
About Us
Testimonials
Contact Us
Our Distinguished Clients
Investing in Non-Profits
Where Are We
Privacy Policy
Software Licensing Agreement
DHTML JavaScript Menu
Product Information
Page Integration
Quick Reference Guides
Embedding Into a Table or DIV
Purchase
Back To Start Of Archive
Taken From The Forum: Archived Topics for the old Version 3.0 JavaScript Menu
Forum Topic: Click to view post
Last Updated: Saturday July 14 2012 - 06:07:34
Problem on Mac OS 9.2 and IE 4.5
Poster: kierenj
Dated: Friday February 28 2003 - 23:44:36 GMT
I have the menu working great on most systems but I am having trouble with one (Mac 9.2 IE 4.5). The problem is that the first level of the menu looks almost right (it is missing menu dividers), but the submenus are squished vertically, so that you can only see the top half of the writing in each line. The problem may be the padding, because I tried adjusting it and although the change can be seen on other browsers and OS, it doesn't change this particular system.
Any help appreciated.
Poster: John
Dated: Monday March 3 2003 - 15:49:42 GMT
A URL so we can see your code is always helpful.
Poster: kierenj
Dated: Monday March 3 2003 - 16:34:55 GMT
Unfortunately I can't post a url (it is a password protected site), but here is the content from the menu_array.js file. Hopefully that will help. Currently I am just putting the menu over an image to show decision makers how this could work, so there shouldn't be any problems with that (I am assuming!).
Thanks!
Kieren
Code:
/*
Milonic DHTML Website Navigation Menu - Version 3.x
Written by Andy Woolley - Copyright 2002 (c) Milonic Solutions Limited. All Rights Reserved.
Please visit http://www.milonic.co.uk/menu or e-mail menu3 __at__ milonic.com for more information.
The Free use of this menu is only available to Non-Profit, Educational & Personal web sites.
Commercial and Corporate licenses are available for use on all other web sites & Intranets.
All Copyright notices MUST remain in place at ALL times and, please keep us informed of your
intentions to use the menu and send us your URL.
*/
//The following line is critical for menu operation, and MUST APPEAR ONLY ONCE. If you have more than one menu_array.js file rem out this line in subsequent files
menunum=0;menus=new Array();_d=document;function addmenu(){menunum++;menus[menunum]=menu;}function dumpmenus(){mt="<script language=javascript>";for(a=1;a<menus.length;a++){mt+=" menu"+a+"=menus["+a+"];"}mt+="<\/script>";_d.write(mt)}
//Please leave the above line intact. The above also needs to be enabled if it not already enabled unless this file is part of a multi pack.
////////////////////////////////////
// Editable properties START here //
////////////////////////////////////
// Special effect string for IE5.5 or above please visit http://www.milonic.co.uk/menu/filters_sample.php for more filters
effect = "Fade(duration=0.2);Alpha(style=0,opacity=95);Shadow(color='#777777', Direction=135, Strength=5)"
timegap=500 // The time delay for menus to remain visible
followspeed=5 // Follow Scrolling speed
followrate=40 // Follow Scrolling Rate
suboffset_top=4; // Sub menu offset Top position
suboffset_left=6; // Sub menu offset Left position
closeOnClick = true
style1=[ // style1 is an array of properties. You can have as many property arrays as you need. This means that menus can have their own style.
"000066", // Mouse Off Font Color
"D6D6D6", // Mouse Off Background Color
"FFFFFF", // Mouse On Font Color
"999999", // Mouse On Background Color
"000066", // Menu Border Color
10, // Font Size in pixels
"normal", // Font Style (italic or normal)
"normal", // Font Weight (bold or normal)
"Verdana, Arial, Helvetica, sans-serif", // Font Name
4, // Menu Item Padding
"arrow.gif", // Sub Menu Image (Leave this blank if not needed)
, // 3D Border & Separator bar
"66ffff", // 3D High Color
"000099", // 3D Low Color
"Purple", // Current Page Item Font Color (leave this blank to disable)
"pink", // Current Page Item Background Color (leave this blank to disable)
"arrowdn.gif", // Top Bar image (Leave this blank to disable)
"FFFFFF", // Menu Header Font Color (Leave blank if headers are not needed)
"000066", // Menu Header Background Color (Leave blank if headers are not needed)
"000066", // Menu Item Separator Color
]
addmenu(menu=[ // This is the array that contains your menu properties and details
"mainmenu", // Menu Name - This is needed in order for the menu to be called
137, // Menu Top - The Top position of the menu in pixels
100, // Menu Left - The Left position of the menu in pixels
120, // Menu Width - Menus width in pixels
1, // Menu Border Width
"left", // Screen Position - here you can use "center;left;right;middle;top;bottom" or a combination of "center:middle"
style1, // Properties Array - this is set higher up, as above
1, // Always Visible - allows the menu item to be visible at all time (1=on/0=off)
"left", // Alignment - sets the menu elements text alignment, values valid here are: left, right or center
, // Filter - Text variable for setting transitional effects on menu activation - see above for more info
, // Follow Scrolling - Tells the menu item to follow the user down the screen (visible at all times) (1=on/0=off)
0, // Horizontal Menu - Tells the menu to become horizontal instead of top to bottom style (1=on/0=off)
0, // Keep Alive - Keeps the menu visible until the user moves over another menu or clicks elsewhere on the page (1=on/0=off)
, // Position of TOP sub image left:center:right
, // Set the Overall Width of Horizontal Menu to 100% and height to the specified amount (Leave blank to disable)
, // Right To Left - Used in Hebrew for example. (1=on/0=off)
, // Open the Menus OnClick - leave blank for OnMouseover (1=on/0=off)
, // ID of the div you want to hide on MouseOver (useful for hiding form elements)
, // Background image for menu when BGColor set to transparent.
, // Scrollable Menu
, // Reserved for future use
,"Home","http://www.dynamicdrive.com",,"Back to the home page",1 // "Description Text", "URL", "Alternate URL", "Status", "Separator Bar"
,"Strategy Exchange ","show-menu=stratX",,"",1
,"Campaigns & Initiatives ","show-menu=campaigns",,"",1
,"Data Sources & Documents ","show-menu=db",,"",1
,"Directories ","show-menu=directories",,"",1
,"Administrative Forms & Policy ","http://www.dynamicdrive.com",,"Administrative Forms & Policy",1 // "Description Text", "URL", "Alternate URL", "Status", "Separator Bar"
,"Web Links ","show-menu=links",,"",1
])
addmenu(menu=["stratX",,,140,1,"",style1,0,"left",,,,,,,,,,,,,
,"Alternative Tobacco","http://www.cnn.com",,"",1
,"Youth Under 18","http://news.bbc.co.uk",,"",1
,"18-24 Years","http://www.msnbc.com",,"",1
,"Enforcement","http://www.abcnews.com",,"",1
,"Project Smart Money","http://www.abcnews.com",,"",1
,"Secondhand Smoke","http://news.bbc.co.uk",,"",1
,"STORE","http://news.bbc.co.uk",,"",1
,"Archive","http://news.bbc.co.uk",,"",1
,"Help","http://news.bbc.co.uk",,"",1
])
addmenu(menu=["campaigns",,,170,1,"",style1,,"left",effect,,,,,,,,,,,,
,"Communities of Excellence","http://www.a-q.co.uk",,,1
,"Project SMART Money","http://www.a-q.co.uk",,,1
,"Secondhand Smoke","http://www.dynamicdrive.com",,,1
,"Enforcement","http://www.javascriptkit.com",,,1
,"STORE","http://www.freewarejava.com",,,1
,"Alternative Tobacco","http://www.freewarejava.com",,,1
])
addmenu(menu=["db",,,120,1,,style1,0,"left",effect,0,,,,,,,,,,,
,"CODE","http://www.tucows.com",,,1
,"DAEU","http://www.tucows.com",,,1
,"CODE","http://www.tucows.com",,,1
,"DHS Web Links","http://www.tucows.com",,,1
,"OTIS","http://www.tucows.com",,,1
,"PARTNERS Library","http://www.tucows.com",,,1
,"Research Wire","http://www.tucows.com",,,1
,"Top 10 (or so) New Resources","http://www.a-q.co.uk",,,1
])
addmenu(menu=["directories",,,150,1,"",style1,,"",effect,,,,,,,,,,,,
,"TCS Directories","# align=center;type=header;",,,1
,"TCS Phone/Email List", "http://www.google.com",,,1
,"TCS Org Chart", "http://www.google.com",,,1
,"Work Groups/Directories", "http://www.google.com",,,1
,"TCS Acronym List", "http://www.google.com",,,1
,"Project Directories","# align=center;type=header;",,,1
,"List of Funded Agencies", "http://www.google.com",,,1
,"List of Users (By Agency)", "http://www.yahoo.com",,,1
,"User E-mail List", "http://altavista.com",,,1
])
addmenu(menu=["admin",,,140,1,"",style1,,"",effect,,,,,,,,,,,,
,"TCS Administrative Forms", "http://www.google.com",,,1
,"New PARTERNS User Form", "http://www.yahoo.com",,,1
,"User E-mail Change", "http://altavista.com",,,1
])
addmenu(menu=["links",,,140,1,"",style1,,"",effect,,,,,,,,,,,,
,"DHS", "http://www.google.com",,,1
,"TRDRP", "http://www.yahoo.com",,,1
,"TECC", "http://www.yahoo.com",,,1
,"Other Prop. 99-Funded Web Sites", "http://altavista.com",,,1
])
dumpmenus()
Milonic DHTML Website Navigation Menu - Version 3.x
Written by Andy Woolley - Copyright 2002 (c) Milonic Solutions Limited. All Rights Reserved.
Please visit http://www.milonic.co.uk/menu or e-mail menu3 __at__ milonic.com for more information.
The Free use of this menu is only available to Non-Profit, Educational & Personal web sites.
Commercial and Corporate licenses are available for use on all other web sites & Intranets.
All Copyright notices MUST remain in place at ALL times and, please keep us informed of your
intentions to use the menu and send us your URL.
*/
//The following line is critical for menu operation, and MUST APPEAR ONLY ONCE. If you have more than one menu_array.js file rem out this line in subsequent files
menunum=0;menus=new Array();_d=document;function addmenu(){menunum++;menus[menunum]=menu;}function dumpmenus(){mt="<script language=javascript>";for(a=1;a<menus.length;a++){mt+=" menu"+a+"=menus["+a+"];"}mt+="<\/script>";_d.write(mt)}
//Please leave the above line intact. The above also needs to be enabled if it not already enabled unless this file is part of a multi pack.
////////////////////////////////////
// Editable properties START here //
////////////////////////////////////
// Special effect string for IE5.5 or above please visit http://www.milonic.co.uk/menu/filters_sample.php for more filters
effect = "Fade(duration=0.2);Alpha(style=0,opacity=95);Shadow(color='#777777', Direction=135, Strength=5)"
timegap=500 // The time delay for menus to remain visible
followspeed=5 // Follow Scrolling speed
followrate=40 // Follow Scrolling Rate
suboffset_top=4; // Sub menu offset Top position
suboffset_left=6; // Sub menu offset Left position
closeOnClick = true
style1=[ // style1 is an array of properties. You can have as many property arrays as you need. This means that menus can have their own style.
"000066", // Mouse Off Font Color
"D6D6D6", // Mouse Off Background Color
"FFFFFF", // Mouse On Font Color
"999999", // Mouse On Background Color
"000066", // Menu Border Color
10, // Font Size in pixels
"normal", // Font Style (italic or normal)
"normal", // Font Weight (bold or normal)
"Verdana, Arial, Helvetica, sans-serif", // Font Name
4, // Menu Item Padding
"arrow.gif", // Sub Menu Image (Leave this blank if not needed)
, // 3D Border & Separator bar
"66ffff", // 3D High Color
"000099", // 3D Low Color
"Purple", // Current Page Item Font Color (leave this blank to disable)
"pink", // Current Page Item Background Color (leave this blank to disable)
"arrowdn.gif", // Top Bar image (Leave this blank to disable)
"FFFFFF", // Menu Header Font Color (Leave blank if headers are not needed)
"000066", // Menu Header Background Color (Leave blank if headers are not needed)
"000066", // Menu Item Separator Color
]
addmenu(menu=[ // This is the array that contains your menu properties and details
"mainmenu", // Menu Name - This is needed in order for the menu to be called
137, // Menu Top - The Top position of the menu in pixels
100, // Menu Left - The Left position of the menu in pixels
120, // Menu Width - Menus width in pixels
1, // Menu Border Width
"left", // Screen Position - here you can use "center;left;right;middle;top;bottom" or a combination of "center:middle"
style1, // Properties Array - this is set higher up, as above
1, // Always Visible - allows the menu item to be visible at all time (1=on/0=off)
"left", // Alignment - sets the menu elements text alignment, values valid here are: left, right or center
, // Filter - Text variable for setting transitional effects on menu activation - see above for more info
, // Follow Scrolling - Tells the menu item to follow the user down the screen (visible at all times) (1=on/0=off)
0, // Horizontal Menu - Tells the menu to become horizontal instead of top to bottom style (1=on/0=off)
0, // Keep Alive - Keeps the menu visible until the user moves over another menu or clicks elsewhere on the page (1=on/0=off)
, // Position of TOP sub image left:center:right
, // Set the Overall Width of Horizontal Menu to 100% and height to the specified amount (Leave blank to disable)
, // Right To Left - Used in Hebrew for example. (1=on/0=off)
, // Open the Menus OnClick - leave blank for OnMouseover (1=on/0=off)
, // ID of the div you want to hide on MouseOver (useful for hiding form elements)
, // Background image for menu when BGColor set to transparent.
, // Scrollable Menu
, // Reserved for future use
,"Home","http://www.dynamicdrive.com",,"Back to the home page",1 // "Description Text", "URL", "Alternate URL", "Status", "Separator Bar"
,"Strategy Exchange ","show-menu=stratX",,"",1
,"Campaigns & Initiatives ","show-menu=campaigns",,"",1
,"Data Sources & Documents ","show-menu=db",,"",1
,"Directories ","show-menu=directories",,"",1
,"Administrative Forms & Policy ","http://www.dynamicdrive.com",,"Administrative Forms & Policy",1 // "Description Text", "URL", "Alternate URL", "Status", "Separator Bar"
,"Web Links ","show-menu=links",,"",1
])
addmenu(menu=["stratX",,,140,1,"",style1,0,"left",,,,,,,,,,,,,
,"Alternative Tobacco","http://www.cnn.com",,"",1
,"Youth Under 18","http://news.bbc.co.uk",,"",1
,"18-24 Years","http://www.msnbc.com",,"",1
,"Enforcement","http://www.abcnews.com",,"",1
,"Project Smart Money","http://www.abcnews.com",,"",1
,"Secondhand Smoke","http://news.bbc.co.uk",,"",1
,"STORE","http://news.bbc.co.uk",,"",1
,"Archive","http://news.bbc.co.uk",,"",1
,"Help","http://news.bbc.co.uk",,"",1
])
addmenu(menu=["campaigns",,,170,1,"",style1,,"left",effect,,,,,,,,,,,,
,"Communities of Excellence","http://www.a-q.co.uk",,,1
,"Project SMART Money","http://www.a-q.co.uk",,,1
,"Secondhand Smoke","http://www.dynamicdrive.com",,,1
,"Enforcement","http://www.javascriptkit.com",,,1
,"STORE","http://www.freewarejava.com",,,1
,"Alternative Tobacco","http://www.freewarejava.com",,,1
])
addmenu(menu=["db",,,120,1,,style1,0,"left",effect,0,,,,,,,,,,,
,"CODE","http://www.tucows.com",,,1
,"DAEU","http://www.tucows.com",,,1
,"CODE","http://www.tucows.com",,,1
,"DHS Web Links","http://www.tucows.com",,,1
,"OTIS","http://www.tucows.com",,,1
,"PARTNERS Library","http://www.tucows.com",,,1
,"Research Wire","http://www.tucows.com",,,1
,"Top 10 (or so) New Resources","http://www.a-q.co.uk",,,1
])
addmenu(menu=["directories",,,150,1,"",style1,,"",effect,,,,,,,,,,,,
,"TCS Directories","# align=center;type=header;",,,1
,"TCS Phone/Email List", "http://www.google.com",,,1
,"TCS Org Chart", "http://www.google.com",,,1
,"Work Groups/Directories", "http://www.google.com",,,1
,"TCS Acronym List", "http://www.google.com",,,1
,"Project Directories","# align=center;type=header;",,,1
,"List of Funded Agencies", "http://www.google.com",,,1
,"List of Users (By Agency)", "http://www.yahoo.com",,,1
,"User E-mail List", "http://altavista.com",,,1
])
addmenu(menu=["admin",,,140,1,"",style1,,"",effect,,,,,,,,,,,,
,"TCS Administrative Forms", "http://www.google.com",,,1
,"New PARTERNS User Form", "http://www.yahoo.com",,,1
,"User E-mail Change", "http://altavista.com",,,1
])
addmenu(menu=["links",,,140,1,"",style1,,"",effect,,,,,,,,,,,,
,"DHS", "http://www.google.com",,,1
,"TRDRP", "http://www.yahoo.com",,,1
,"TECC", "http://www.yahoo.com",,,1
,"Other Prop. 99-Funded Web Sites", "http://altavista.com",,,1
])
dumpmenus()
Poster: kierenj
Dated: Tuesday March 4 2003 - 16:47:20 GMT
Also, here is the page that the menu is on (right now it is just over an image).
Thanks!
Kieren
Code:
<html>
<head>
<title>PARTNERS RE-DESIGN</title>
</head>
<body bgcolor=white leftmargin="0" topmargin="0" rightmargin="0" bottommargin="0" marginwidth="0" marginheight="0"><SCRIPT language=JavaScript>
/*
Milonic DHTML Website Navigation Menu.
Written by Andy Woolley - Copyright 2003 (c) Milonic Solutions Limited. All Rights Reserved.
Please visit http://www.milonic.co.uk/ for more information.
*/
/*
Although this software may have been freely downloaded, you must obtain a license before using it in any production environment.
The free use of this menu is only available for Non-Profit, Educational & Personal Web Sites who have obtained a license to use.
Free, Commercial and Corporate Licenses are available from our website.
You also need to include a link back to http://www.milonic.co.uk/ if you use the free license.
All Copyright notices MUST remain in place at ALL times.
This includes the first three lines of this notice on every page that uses the menu.
If you cannot comply with all of the above requirements, please contact us to arrange license waiver.
*/
</SCRIPT>
<SCRIPT language=JavaScript src="menu_array.js" type=text/javascript></SCRIPT>
<SCRIPT language=JavaScript src="mmenu.js" type=text/javascript></SCRIPT>
<img src="images/partners1.gif" width="640" height="480">
</body>
<head>
<title>PARTNERS RE-DESIGN</title>
</head>
<body bgcolor=white leftmargin="0" topmargin="0" rightmargin="0" bottommargin="0" marginwidth="0" marginheight="0"><SCRIPT language=JavaScript>
/*
Milonic DHTML Website Navigation Menu.
Written by Andy Woolley - Copyright 2003 (c) Milonic Solutions Limited. All Rights Reserved.
Please visit http://www.milonic.co.uk/ for more information.
*/
/*
Although this software may have been freely downloaded, you must obtain a license before using it in any production environment.
The free use of this menu is only available for Non-Profit, Educational & Personal Web Sites who have obtained a license to use.
Free, Commercial and Corporate Licenses are available from our website.
You also need to include a link back to http://www.milonic.co.uk/ if you use the free license.
All Copyright notices MUST remain in place at ALL times.
This includes the first three lines of this notice on every page that uses the menu.
If you cannot comply with all of the above requirements, please contact us to arrange license waiver.
*/
</SCRIPT>
<SCRIPT language=JavaScript src="menu_array.js" type=text/javascript></SCRIPT>
<SCRIPT language=JavaScript src="mmenu.js" type=text/javascript></SCRIPT>
<img src="images/partners1.gif" width="640" height="480">
</body>
Poster: John
Dated: Tuesday March 4 2003 - 18:36:52 GMT
Boy - the things we'll do...
First time I've had Classic up in more months than I can remember. Put what you posted together as a page and gave it a try under 9.2. Unfortunately the best I can do on IE is 5.1.4. There everything looks fine.
4.5 is pretty far back. Is that something you really have to worry about? I should talk - I'm stuck supporting NS4.79 under Win which is just about as far removed!
Sorry I couldn't be more help.
Poster: kierenj
Dated: Tuesday March 4 2003 - 18:47:17 GMT
Ah well.. thanks for your help on this. At least I know it isn't some mistake I made.
Thanks!
Kieren
Poster: kevin3442
Dated: Tuesday March 4 2003 - 20:47:48 GMT
Two thoughts:
(1) Do you have a pseudo class defined for a:link? I've known the menus to take on properties of this class.
(2) Suggested kludge: You could try placing a 1px transparent gif in front of or after the text in the submenu's "Description Field." In the <img> tag, tweak the height= attribute to see if that'll force the height. Of course, this would have to look good in every other browser too.
Kevin
Poster: kierenj
Dated: Tuesday March 4 2003 - 20:59:10 GMT
Quote:
(1) Do you have a pseudo class defined for a:link? I've known the menus to take on properties of this class.
At the moment I am not using stylesheets as this is at the design phase and the menu is over an image of the design, but that is great to know that it may cause problems with stylesheets
Quote:
(2) Suggested kludge: You could try placing a 1px transparent gif in front of or after the text in the submenu's "Description Field." In the <img> tag, tweak the height= attribute to see if that'll force the height. Of course, this would have to look good in every other browser too.
great idea! I will give that a go.
Thanks!
Kieren