submenu positions in IE vs. Firefox

gjensen · Post by **gjensen** » Tue Nov 22, 2005 10:38 pm

http://www.endurant.org/

If you notice the submenu drops down perfectly in firefox, but not so perfectly in Internet Explorer.

have advice?

here's my code:

Code: Select all

<script type="text/javascript">

with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
itemheight=14;
itemwidth=186;
left=10;
position="relative";
orientation="horizontal";
style=menuStyle;
top=10;
aI("align=center;bgimage=/dhtml-nav/itemblue.gif;overbgimage=/dhtml-nav/itemcoral_on.gif;showmenu=Recent;text=RECENT ENTRIES;");
aI("align=center;bgimage=/dhtml-nav/itemblue.gif;overbgimage=/dhtml-nav/itemorange_on.gif;showmenu=Categories;text=CATEGORIES;url={path=weblog/categories};");
aI("align=center;bgimage=/dhtml-nav/itemblue.gif;overbgimage=/dhtml-nav/itemviolet_on.gif;showmenu=Featured;text=FEATURED ENTRIES;");
aI("align=center;bgimage=/dhtml-nav/itemblue.gif;overbgimage=/dhtml-nav/itemgreen_on.gif;showmenu=Search;text=SEARCH;");
}

with(milonic=new menuname("Recent")){
itemheight=14;
itemwidth=226;
style=submenuStyle;
{exp:weblog:entries orderby="date" sort="desc" limit="15" weblog="weblog1" dynamic="off"}aI("text={title};url={title_permalink=weblog/index};");{/exp:weblog:entries}
}

with(milonic=new menuname("Categories")){
itemheight=14;
itemwidth=126;
style=submenuStyle;
aI("text=View All;url={path=weblog/categories};");
{exp:weblog:category_archive weblog="weblog1" show_empty="yes"  style="linear"}{categories}aI("text={category_name};url={path=weblog/index};");{/categories}{/exp:weblog:category_archive}
}

with(milonic=new menuname("Featured")){
itemheight=14;
itemwidth=126;
style=submenuStyle;
aI("status=Apache Web Server, the basis of Milonic's Web Site;text=Apache Server;url=http://www.apache.org/;");
aI("status=MySQL, Milonic's Prefered Choice of Database Server;text=MySQL Database Server;url=http://ww.mysql.com/;");
aI("status=PHP - Web Server Scripting as used by Milonic;text=PHP - Development;url=http://www.php.net/;");
aI("status=PHP Based Web Forum, Milonic's Recommended Forum Software;text=phpBB Web Forum System;url=http://www.phpbb.net/;");
aI("showmenu=Anti Spam;status=Anti Spam Solutions, as used by Milonic;text=Anti Spam;");
}

with(milonic=new menuname("Search")){
itemheight=14;
itemwidth=126;
style=submenuStyle;
aI("text=Spam Cop;url=http://www.spamcop.net/;");
aI("text=Mime Defang;url=http://www.mimedefang.org/;");
aI("text=Spam Assassin;url=http://www.spamassassin.org/;");
}

drawMenus();

</script>

Post by **Ruth** » Wed Nov 23, 2005 1:16 am

Hi George,

It's something in the css though I've not been able to find it. If you remove the css file, just for testing purposes, the submenus drop fine in IE.

Ruth

gjensen · Post by **gjensen** » Wed Nov 23, 2005 3:22 am

Ruth,

I took the div tag out entirely... and this didn't fix anything. The only other tag affecting it would be the <body> tag. I commented out the <body> tag properties and it still was broken.

The next steps would be to manually move them through submenu properties. I need to move other submenus further down the page... so please help me learn how to manually move them. I don't mind if firefox is a little below... I just can't have IE submenus too high.

please advise...

Post by **Ruth** » Wed Nov 23, 2005 4:06 am

Hi,

I cut everything from the css file [index.css is what gets downloaded] and then began adding back line by line. The problem is in the #wrapper. It's the width. If you remove width from that the submenus drop correctly in FF and IE.

I'll be taking a look at the page tonight and post more tomorrow as to other things.

You have the menu in a div using position=relative; but you have two menus named main menu which will cause problems, and you also have the submenus after the main menu. The menu shouldn't be in a div, but a lot of people do that and use the position="relative"; which is necessary, but I believe they should be following the directions for table placement which requires that the calls for the menu files, including the menu_data.js file which should have the submenus in it should be immediately after the body tag. They need to be drawn before any other html object and before the main menu or there will be problems in other browsers as to submenu position.

If you could be a little more specific using your site as the example on just what you want to do with other submenus and which submenus I might be able to figure something out.

Ruth

gjensen · Post by **gjensen** » Wed Nov 23, 2005 4:35 am

Wow Ruth, Here's exactly what I'm trying to do: hide busy data.

1. I need the top horizontal menu to be your typical dropdown menu which pulls data dynamically through the blog software: categories, entries...etc. These behave as hover states.

2. I need the right side of the page to represent other busy content... but hidden in vertical menus which fly leftward. I need to be able to customize the size (width-hieght & position) of each flyout in this bar. Each button would vertically display: Site Stats; Members; Search; Syndicate; Mailing List; These behave as onClicks.

3. Each entry will have "Entry Info" (i.e. trackback, permalink, comments, etc). This vertical menu will fly out downward. These behave as onClicks.

Question: Is this putting the menu beyond it's scope? I'll re-read your last post and try to figure how to implement you suggestions like adding a table in place of div tags.

Thanks for you efforts in finding the #wrapper tag. I will make this adjustment as well. Very swift effort on your part.

thanks again.

gjensen · Post by **gjensen** » Wed Nov 23, 2005 5:50 pm

Ruth, I have some things working and others not.

I made your suggested changes:
1. renaming "Main Menu" to "Entry Menu" and "Side Menu" making a total of 3 menu systems in a give page.
2. I added the table, but don't know how I'm going to compensate the IE menu drop down... unless I take away the relative positioning... which I will try soon.

*I cannot get the "Entry Menu" to do openonclick=1 . It just breaks when I add the property.
* and I can't get the "Side Menus" to align more closely together.

Anyway, that's all for now.
thanks for your further help on this.
And happy thanks giving.

George.

Milonic JavaScript Menu

submenu positions in IE vs. Firefox

submenu positions in IE vs. Firefox

tried without fixing

wow thanks... here's more

working / not working