View Full Version : Dynamic top menu not working correctly

12-23-2009, 04:02 AM
I'm using a navigation menu I got here at dynamic drive its a top menu w/drop down menu's I'm having the following problems with it I was hoping some here could help me out with a solution to fix it.

I noticed that my top menu is not working w/all display settings (in Firefox), the page width stays the same and is centered. But w/a display resolution set at 1366x768 the drop down menu gets pushed way to the right.

Please view my site at www.tileestimator.net

It appears as if my top menu stays the same distance from the right side of the page, so when the display settings are set higher the drop down menu will display its menu in the same place regardless of where the mouse/selected menu is. Please View and try to see for your self.

In IE appears to work ok regardless of the display settings, it will adjust with the page, but not in firefox.

If there is not a fix, can some one recommend a menu that will replace this one and is similar to this one.


12-23-2009, 06:11 AM
in your menu,js
change 100% to 999

try that

HTMLstr += "<table width='999' bgcolor='"+this.bgColor+"' border='"+this.mainPaneBorder+"'>\n";

12-23-2009, 06:34 AM
I did as you said stringcugu, but unfortunately it is still doing the same thing, the menu spread out across the page but the drop down menus still show up way over to the right side.

I have an idea below is the code that Experts exchange gave me that center aligns my page, (this code is what messed up my menu, but i need it so the page and header image stay the same width) can this code be changed to left align my page but still keep it a fixed width, that might help the menu line up. Sorry I'm learning html and css etc

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
#wrapper {
margin: 0px auto; /*centers the element */
width: 960px;/*This is your width for the content. Give it whatever number will suit you */
position: relative;/*positions it relative to the Google code. */

<div id="wrapper">

<!--insert your web code NOT Google code here -->


12-23-2009, 06:56 AM
I removed the following line from the code i pasted above and now the drop down menu is where its suppose to be below the selected menu, but it pushed the menu over to the left, can I tell the menu line up with the left side page or have the page move over to left side?

It's getting a little better. I noticed in firefox the page is center aligned but in IE its not at 1366x768

I deleted this
position: relative;/*positions it relative to the Google code. */

12-23-2009, 09:40 AM
try this 5 line under the alert
<<<< //alert(document.getElementById(idMainMenu+"submenu").id)>>>>

submenu.top = menu.style.top+19;

and this
var submenuwidth=100 //specify sub menus' width was 200 now 100

and change the 999 to 951

12-25-2009, 12:32 AM
I did as you posted, still no luck, I did find a work around.

I left justified the page and moved the ads by google down a little lower.

I'm looking for a side vertical menu for my site it will go in the left column, above the ads by google, if you have any suggestions on which one you prefer Please let me know.

As for now I'll keep my top menu the way it is w/page left justified.