Milonic provide full featured pull down web menus for some of the worlds largest companies
click here to see what it can do for you

Download Milonic DHTML Menu
Buy Milonic DHTML Menu

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:36

sub menus off-set


Poster: brrobin1
Dated: Friday January 3 2003 - 20:19:54 GMT

Ok I'm gonna try to re-word this so I don't sound so stupid. I'm working on a new site that does not yet even have hosting so there will be no links sorry. While implementing this menu horizontally I originally had the page background and the menu background set to white and I had no problems. However when I changed the menu background to yellow I noticed a problem. The menu drop downs were off set by one pixel in relation to the menu items. (ex. the drop downs had a one pixel width column of yellow sticking out to the left of the menu item and a one pixel width column of white sticking in from the right) I fixed this problem in IE and later versions of NS however NS 4 and below still have this problem. This being the only problem I have left has made me inclined to go ahead with production however I would greatly appreciate any help you can offer me.


Poster: kevin3442
Dated: Saturday January 4 2003 - 7:07:08 GMT

Hi,

It may just be me, or the late hour... but I don't quite understand your description. Can you post a URL so that we can see exactly what's going on and examine the code behind it? If not, can you paste your menu array code into a code block, in a reply? Much easier to help that way.

Kevin


Poster: brrobin1
Dated: Monday January 6 2003 - 12:53:54 GMT

Here is my menu_aray.js file. server.com is not my address but a place holder untill I can get my own server.

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=88);Shadow(color='#777777', Direction=135, Strength=0)"


timegap=500      // The time delay for menus to remain visible
followspeed=5      // Follow Scrolling speed
followrate=40      // Follow Scrolling Rate
suboffset_top=0;   // Sub menu offset Top position
suboffset_left=0;   // 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.
"blue",         // Mouse Off Font Color
"white",      // Mouse Off Background Color
"red",         // Mouse On Font Color
"FFCC00",      // Mouse On Background Color
"white",      // Menu Border Color
12,         // Font Size in pixels
"normal",      // Font Style (italic or normal)
"bold",         // Font Weight (bold or normal)
"Verdana, sans-serif",   // Font Name
2,         // Menu Item Padding
,         // Sub Menu Image (Leave this blank if not needed)
,         // 3D Border & Separator bar
"white",      // 3D High Color
"white",      // 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)
,         // Top Bar image (Leave this blank to disable)
"orange",      // Menu Header Font Color (Leave blank if headers are not needed)
"000099",      // Menu Header Background Color (Leave blank if headers are not needed)
"white",      // Menu Item Separator Color
]

style2=[      // style2 is an array of properties. You can have as many property arrays as you need. This means that menus can have their own style.
"blue",         // Mouse Off Font Color
0,         // Mouse Off Background Color
"red",         // Mouse On Font Color
0,         // Mouse On Background Color
"FFCC00",      // Menu Border Color
12,         // Font Size in pixels
"normal",      // Font Style (italic or normal)
"bold",         // Font Weight (bold or normal)
"Verdana, sans-serif",   // Font Name
4,         // Menu Item Padding
,         // Sub Menu Image (Leave this blank if not needed)
0,         // 3D Border & Separator bar
"FFCC00",      // 3D High Color
"FFCC00",      // 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)
,         // Top Bar image (Leave this blank to disable)
"orange",      // Menu Header Font Color (Leave blank if headers are not needed)
"000099",      // Menu Header Background Color (Leave blank if headers are not needed)
"white",      // 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
97,         // Menu Top - The Top position of the menu in pixels
200,         // Menu Left - The Left position of the menu in pixels
149,         // Menu Width - Menus width in pixels
0,         // Menu Border Width
"center",      // 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
effect,         // 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)
1,          // Horizontal Menu - Tells the menu to become horizontal instead of top to bottom style (1=on/0=off)
,         // 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
,"Getting&nbsp;Started&nbsp;&nbsp;","show-menu=started","http://www.server.com/started.html target=main","",1      // "Description Text", "URL", "Alternate URL", "Status", "Separator Bar"
,"Test&nbsp;Drive&nbsp;&nbsp;","show-menu=test","http://www.server.com/test_drive.html target=main","",1
,"FAQs&nbsp;&nbsp;","show-menu=faq",,"",1
,"User&nbsp;Information&nbsp;&nbsp;","show-menu=user",,"",1
,"Enroll&nbsp;&nbsp;","show-menu=enroll",,"",1
])

   addmenu(menu=["started",
   ,,150,0,"",style2,,"left",effect,,,,,,,,,"images/bk.gif",,,
   ,"With&nbsp;Frames","http://www.server.com/started.html target=main",,,1
   ,"No&nbsp;Frames","http://www.server.com/Nstarted.html target=main",,,1
   ])
   
   
   addmenu(menu=["test",
   ,,150,0,"",style2,,"left",effect,,,,,,,,,"images/bk.gif",,,
   ,"With&nbsp;Frames","javascript:win(\"http://www.server.com/TD.html\");",,,1
   ,"No&nbsp;Frames","javascript:win(\"http://www.server.com/NTD.html\");",,,1
   ])
   
   addmenu(menu=["faq",,,150,0,,style2,0,"left",effect,,,,,,,,,"images/bk.gif",,,
   ,"With&nbsp;Frames","http://www.server.com/faqs.html target=main",,,1
   ,"No&nbsp;Frames","http://www.server.com/Nfaqs.html target=main",,,1
   ])
   
   addmenu(menu=["user",
   ,,150,0,"",style2,,"",effect,,,,,,,,,"images/bk.gif",,,
   ,"With&nbsp;Frames", "http://www.server.com/user.htm target=main",,,1
   ,"No&nbsp;Frames", "http://www.server.com/Nuser.html target=main",,,1
   ])

   addmenu(menu=["enroll",
   ,,150,0,"",style2,,"",effect,,,,,,,,,"images/bk.gif",,,
   ,"With&nbsp;Frames", "http://www.server.com/enroll.htm target=main",,,1
   ,"No&nbsp;Frames", "http://www.server.com/Nenroll.html target=main",,,1
   ])
   

dumpmenus()


Poster: brrobin1
Dated: Monday January 6 2003 - 16:07:59 GMT

Here is my html file. server.com is not the actuall address of the site but a place holder untill I get my own server.

Code:
<html>
<head>
<title>DHTML Menu Sample</title>
<link rel="stylesheet" type="text/css" href="http://www.server.com/acct_style.css">
<SCRIPT language="JavaScript">
<!--
function netscape()
{
   mapWindow = window.open('http://www.server.com/netscape_users.html','browser','width=700,height=500,resizable=yes,scrollbars=yes,status=yes')
}
function win(i)  { 
   mapWindow = window.open(i,'nfWIN', 'toolbar=yes,location=no,directories=no,status=no,menubar=yes,scrollbars=yes,resizable=yes,width=700,height=400,left=10,top=10'); 
   mapWindow.focus();
             } 

//-->
</SCRIPT>
</head>

<body bgcolor="#FFFFFF" text="#000000" link="#3333CC" vlink="#007722" alink="#C0C0C0" topmargin="0" leftmargin="20" marginheight="0" marginwidth="0">
<SCRIPT language=JavaScript src="menu_array.js" type=text/javascript></SCRIPT>
<SCRIPT language=JavaScript src="mmenu.js" type=text/javascript></SCRIPT>

<table width="99%" cellspacing="0" cellpadding="0" border="0">
   <tr>
      <td width="10">&nbsp;</td>
      <td>
         <table width="99%" cellspacing="0" cellpadding="0" background="images/bar.gif" height="33" border="0">
            <tr>
               <td width="100%" align="right" valign="middle"><font color="#ffffff" face="Arial"><b>INFORMATION</b></font>&nbsp;&nbsp;</td>
            </tr>
         </table>
         <table width="99%" cellspacing="0" cellpadding="0" border="0">
            <tr>
               <td><a href="http://www.server.com" target="_top"><img src="images/logo.gif" alt="Home" border="0"></a></td>
               <td><a href="javascript:win('http://www.server.com/whatsnew.html');"><img src="http://www.navyfcu.org/images/aa-out.gif" border="0" alt="What's New!"></a></td>
               <td><a href="javascript:win('http://www.server.com/signup.html','main_frames', 'toolbar=yes,location=no,directories=no,status=no,menubar=yes,scrollbars=yes,resizable=yes,width=660,height=600,left=0,top=10');">Sign Up</a> <font color="#FFCC00" size="+2">|</font> <a href="javascript:win('http://www.server.com/privacy.html');">Privacy</a> <font color="#FFCC00" size="+2">|</font> <a href="http://www.server.com" target="_top">Home</a> <font color="#FFCC00" size="+2">|</font> <a href="http://www.server.com/logon.html" target="_top"><img src="images/signon1.gif" border="0" align="absbottom" alt="sign on"></a></td>
            </tr>
         </table>
         <table width="99%" cellspacing="0" cellpadding="0" border="0">
            <tr>
               <td>
                    <script language=JavaScript>
                        PlaceMenu("mainmenu")
                    </script>
                </td>
            </tr>
         </table>
         <table width="99%" cellspacing="0" cellpadding="0" height="5" border="0">
            <tr>
               <td>
                  <BR>
               </td>
            </tr>
            <tr>
               <td width="100%" align="right" valign="top" background="images/bar2.gif"><img src="images/blank.gif" width="5" height="5" alt="" border="0"></td>
            </tr>
         </table>
      </td>
   </tr>
</table>
</body>   
</html>


Poster: brrobin1
Dated: Tuesday January 7 2003 - 15:56:35 GMT

I updated the question and both of my code blocks since I got some of the problem solved. Here is a picture of one of my menu items and its related drop down.
Image
Notice the white bar in the upper left, that is what I am talking about with the off-set. Also as a secondary question if anyone know how to get rid of the white bar between the two drop down options I would apreciate it.


Poster: brrobin1
Dated: Thursday January 9 2003 - 20:59:18 GMT

Has anyone else even had this problem?


Poster: brrobin1
Dated: Thursday January 16 2003 - 20:03:04 GMT

bump