Milonic DHTML/JavaScript Menu Sample Page

Editing the menu

To edit the menu, open the file menu_data.js in a text editor and edit the details inside the aI() text strings
To add more menu items, just create another aI() string on a new line and enter your properties
add a showmenu=MENUNAME; property if you want this menu to open a sub menu
To Add more menus, copy another menu and paste it inside your data file. A menu starts: with(milonic=new menuname("MENUNAME")){ and ends: }
Any problems, visit http://www.milonic.com/forum. Beginners guide is at http://www.milonic.com/beginner.php

To get the menu onto your website, insert the following HTML into each page using the menu:

<script type="text/javascript" src="milonic_src.js"></script> 
<script type="text/javascript" src="mmenudom.js"></script> 
<noscript><a href=http://www.milonic.com/>JavaScript DHTML menu is only visible when JavaScript is enabled</a></noscript>
<!-- The next file contains your menu data, links and menu structure etc -->
<script type="text/javascript" src="menu_data.js"></script>

Links to other menu demos are:

Please note that users of Microsoft Windows XP with Service Pack 2 will need to unblock this page in order to see the menu. The reason for this is due to the fact that the menu has been written in JavaScript. This feature is considered unsafe when used locally and Service Pack 2 now blocks this by default for your safety. This only happens when you run the menu on a local machine, live use on the Internet will not be affected. Milonic Solutions Ltd assure you that there is absolutely no danger of allowing content from the DHTML Menu provided it has been downloaded from www.milonic.com

For instructions on removing the forced popup message, please visit http://www.milonic.com/removelink.php

For information on menu properties, please see http://www.milonic.com/menuproperties.php
For information on menu item properties, please see http://www.milonic.com/itemproperties.php
For information on style properties, please see http://www.milonic.com/styleproperties.php

Installation instructions - install.html
How to build menus - howtobuild.html
Read Me - readme.html
License Details - license.html

Table Based (Relative) Menus

Left Aligned Table Cell

Center Aligned Table containing the menu

This sample demonstrates how to put the menu inside a table cell.

Important: Please note that embedding the menu inside a table cell is NOT as simple as just declaring the menu code files or the menu_data file inside the table cell. Although this will work on most browsers, some have serious issues with this and could break your menus positioning or even render the menu unusable. Internet Explorer for the Apple Mac will have problems positioning sub menus, embedded inside a table cell, unless the proper technique is adhered to.

Please see the FAQ article: Mac Trouble for more information

There are a few modifications you need to make with this menu style, the key property is the position="relative"; property. This needs to be declared for the (alwaysvisible) main menu you want inserting into the table.

Also, you must ONLY insert the main menu inside the table cell, all other sub menus MUST be positioned outside of the table or any other HTML object this includes DIV's and SPAN's.

The following illustrates the structure that should be used for embedding menus in a table. All of the sub menus are configured inside the file menu_data.js that has been loaded as one of the first objects after the BODY tag and are all independent of other HTML objects. What this does is ensure that the sub menus are free to move about your web page and are not restricted by boundary constraints imposed by embedding sub menus inside relative objects.

<html>
<head>
</head>
<body>

<script language=JavaScript src="/milonic_src.js" type=text/javascript></script>
<script language=JavaScript>
if(ns4)_d.write("<scr"+"ipt language=JavaScript src=/mmenuns4.js></scr"+"ipt>");
else _d.write("<scr"+"ipt language=JavaScript src=/mmenudom.js></scr"+"ipt>");
</script>
<script language=JavaScript src="/menu_data.js" type=text/javascript></script>

<table>
<td>
<script>
with(milonic=new menuname("Main Menu")){
style=menuStyle;
alwaysvisible=1;
orientation="horizontal";
position="relative";
aI("text=Home;url=http://www.milonic.com/;status=Back To Home Page;");
aI("text=Menu Samples;showmenu=Samples;");
aI("text=Milonic;showmenu=Milonic;");
aI("text=Partners;showmenu=Partners;");
aI("text=Links;showmenu=Links;");
aI("text=My Milonic;showmenu=My Milonic;");
}
drawMenus();
</script>
</td>
</table>
</body>

From the code above, you will see that the sub menus are included in the <BODY> of the document. As these menus are "absolutely positioned" they are independent of all other HTML objects. The only menu that IS dependant on the flow of the HTML is "Main Menu" and this has been included separately inside the cell of the table.

Right Aligned Table Cell