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: Help & Support for DHTML Menu Version 5+
Forum Topic: Click to view post
Last Updated: Saturday July 14 2012 - 06:07:36

menuheight: Different height depending on browser


Poster: auroraes
Dated: Thursday August 11 2005 - 17:28:10 BST

Hello it seems that the menuheight property is not consistant between browsers. For example, I entered a menuheight of 182 (menuheight=182;) for a submenu, but in Firefox 1.0.6 the menu height is actually 174 and the menu height in IE is 184. Neither what I had actually specified. For what I'm doing I need the menuheight to be near exact for each browser.

Here's my menu style for the submenu...

Code:
with(menuStyle=new mm_style()){
imagepadding=0;
separatorsize=10;
offbgcolor="#FF00FF";
onbgcolor="#FF00FF";
overfilter="Alpha(opacity=90)";

}



Here's my submenu code...

Code:
with(milonic=new menuname("profile")){
style=menuStyle;
overflow="scroll";
left=181;
menuheight=182;
top=41;
aI("image=/images/sl-cp-overview.gif;url=/cgi-bin/landing.cgi?ref=profile;imagewidth=93;imageheight=7;title=");
aI("image=/images/sl-cp-philosophy.gif;url=#;imagewidth=93;imageheight=9;title=");
aI("image=/images/sl-cp-profiles.gif;url=#;imagewidth=93;imageheight=7;title=");
aI("image=/images/sl-cp-history.gif;url=#;imagewidth=93;imageheight=9;title=");
aI("image=/images/sl-cp-company.gif;url=#;imagewidth=93;imageheight=20;title=");
aI("image=/images/sl-cp-international.gif;url=#;imagewidth=93;imageheight=18;title=");
aI("image=/images/sl-cp-lan.gif;url=#;imagewidth=93;imageheight=20;title=");
}


And here is the menu in both browsers (Firefox on the left, IE on the right) - Nasty color used to show the menu background.

Image

Any help to make these the same height is much appriciated.

Thanks!
Matt


Poster: Ruth
Dated: Thursday August 11 2005 - 17:47:22 BST

Hi Matt,

Is there anyway you can put up a test page so we can see your css, htm, and full menu coding? There are a lot of things that could be causing that problem and without all that info it's really hard to narrow the problem.

Ruth


Poster: Ruth
Dated: Thursday August 11 2005 - 20:13:06 BST

Hi Matt,

I can give you a negative. It is not the stylesheet as far as I can tell since I removed it and the problem persisted.

There is nothing I can find that is causing it. I've reported it.

Ruth


Poster: auroraes
Dated: Thursday August 11 2005 - 20:27:09 BST

Thanks! I appriciate your help with this.

Matt


Poster: John
Dated: Thursday August 11 2005 - 23:02:39 BST

While I'm pretty sure the menu should default to this, try...
Code:
menuheight="182px";


Poster: auroraes
Dated: Thursday August 11 2005 - 23:14:55 BST

Hi John,

That appears to actually break the menu making the submenu a very tiny scrollable area breaking the width as well (maybe around a 20px X 20px square). menuheight seems to want to expect a number instead of a string.

Thanks!
Matt


Poster: John
Dated: Friday August 12 2005 - 0:25:25 BST

Oh, well - my one idea of the day, down the drain... :roll:


Poster: Andy
Dated: Monday August 15 2005 - 15:48:05 BST

Is there any CSS on the page that could be causing this.

Just checked it and when I set a menuheight to a menu, it does appear the same in both browsers.

-- Andy


Poster: auroraes
Dated: Monday August 15 2005 - 16:33:48 BST

I stripped out all other css, and still get a 10 pixel difference between the browsers. I set menuheight for each menu to 184, and get a height of 186 in IE and a height of 176 in FireFox.

Here's the menu_data, maybe I'm not using something in it correctly?

Code:
_menuCloseDelay=500;
_menuOpenDelay=150;
_subOffsetTop=0;
_subOffsetLeft=0;

// Added function to get query string to determine
// which section we are on.
function getQueryVariable(variable) {
var query = window.location.search.substring(1);
  var vars = query.split("&");
  for (var i=0;i<vars.length;i++) {
    var pair = vars[i].split("=");
    if (pair[0] == variable) {
      return pair[1];
    }
  }
}
var ref = getQueryVariable("ref")



with(mainmenuStyle=new mm_style()){
imagepadding=0;
separatorsize=7;
}

with(menuStyle=new mm_style()){
imagepadding=1;
separatorsize=9;
offbgcolor="#FF00FF";
onbgcolor="#FF00FF";
overfilter="Alpha(opacity=85)";

}

with(milonic=new menuname("Main Menu")){
style=mainmenuStyle;
alwaysvisible=1;
left=52;
orientation="vertical";
top=41;
if (ref == "profile") {
aI("image=/images/ml-profile-on.gif;url=/cgi-bin/landing.cgi?ref=profile;showmenu=profile;imagewidth=130;imageheight=11;title=;");
} else {
aI("image=/images/ml-profile-off.gif;overimage=/images/ml-profile-on.gif;url=/cgi-bin/landing.cgi?ref=profile;showmenu=profile;imagewidth=130;imageheight=11;title=;");
}

if (ref == "design") {
aI("image=/images/ml-design-on.gif;url=/cgi-bin/landing.cgi?ref=design;showmenu=design;imagewidth=130;imageheight=11;title=;");
} else {
aI("image=/images/ml-design-off.gif;overimage=/images/ml-design-on.gif;url=/cgi-bin/landing.cgi?ref=design;showmenu=design;imagewidth=130;imageheight=11;title=;");
}
   
if (ref == "services") {
aI("image=/images/ml-services-on.gif;url=/cgi-bin/landing.cgi?ref=services;showmenu=services;imagewidth=130;imageheight=11;title=;");
} else {
aI("image=/images/ml-services-off.gif;overimage=/images/ml-services-on.gif;url=/cgi-bin/landing.cgi?ref=services;showmenu=services;imagewidth=130;imageheight=11;title=;");
}
   
if (ref == "markets") {
aI("image=/images/ml-markets-on.gif;url=/cgi-bin/landing.cgi?ref=markets;showmenu=markets;imagewidth=130;imageheight=11;title=;");
} else {
aI("image=/images/ml-markets-off.gif;overimage=/images/ml-markets-on.gif;url=/cgi-bin/landing.cgi?ref=markets;showmenu=markets;imagewidth=130;imageheight=11;title=;");
}

if (ref == "projects") {
aI("image=/images/ml-projects-on.gif;url=/cgi-bin/landing.cgi?ref=projects;imagewidth=130;imageheight=11;title=;");
} else {
aI("image=/images/ml-projects-off.gif;overimage=/images/ml-projects-on.gif;url=/cgi-bin/landing.cgi?ref=projects;imagewidth=130;imageheight=11;title=;");
}

if (ref == "knowledge") {
aI("image=/images/ml-knowledge-on.gif;url=/cgi-bin/landing.cgi?ref=knowledge;showmenu=knowledge;imagewidth=130;imageheight=11;title=;");
} else {
aI("image=/images/ml-knowledge-off.gif;overimage=/images/ml-knowledge-on.gif;url=/cgi-bin/landing.cgi?ref=knowledge;showmenu=knowledge;imagewidth=130;imageheight=11;title=;");
}

if (ref == "locations") {
aI("image=/images/ml-locations-on.gif;url=/cgi-bin/landing.cgi?ref=locations;showmenu=locations;imagewidth=130;imageheight=11;title=;");
} else {
aI("image=/images/ml-locations-off.gif;overimage=/images/ml-locations-on.gif;url=/cgi-bin/landing.cgi?ref=locations;showmenu=locations;imagewidth=130;imageheight=11;title=;");
}

if (ref == "careers") {
aI("image=/images/ml-careers-on.gif;url=/cgi-bin/landing.cgi?ref=careers;showmenu=careers;imagewidth=130;imageheight=11;title=;");
} else {
aI("image=/images/ml-careers-off.gif;overimage=/images/ml-careers-on.gif;url=/cgi-bin/landing.cgi?ref=careers;showmenu=careers;imagewidth=130;imageheight=11;title=;");
}


}

with(milonic=new menuname("profile")){
style=menuStyle;
overflow="scroll";
left=182;
menuheight=184;
menuwidth=95;
top=41;
aI("image=/images/sl-cp-overview-mo.gif;url=/cgi-bin/profile.cgi?loc=overview;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-cp-philosophy-mo.gif;url=/cgi-bin/profile.cgi?loc=philosophy;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-cp-profiles-mo.gif;url=/cgi-bin/profile.cgi?loc=profiles;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-cp-history-mo.gif;url=/cgi-bin/profile.cgi?loc=history;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-cp-background-mo.gif;url=/cgi-bin/profile.cgi?loc=background;imagewidth=93;imageheight=20;title=;");
aI("image=/images/sl-cp-international-mo.gif;url=/cgi-bin/profile.cgi?loc=international;imagewidth=93;imageheight=18;title=;");
aI("image=/images/sl-cp-lan-mo.gif;url=/cgi-bin/profile.cgi?loc=lan;imagewidth=93;imageheight=20;title=;");
}

with(milonic=new menuname("design")){
style=menuStyle;
overflow="scroll";
left=182;
menuheight=184;
top=41;
aI("image=/images/sl-de-overview-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-de-design-mo.gif;url=#;imagewidth=93;imageheight=20;title=;");
aI("image=/images/sl-de-leed-mo.gif;url=#;imagewidth=93;imageheight=8;title=;");
aI("image=/images/sl-de-awards-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
}

with(milonic=new menuname("services")){
style=menuStyle;
overflow="scroll";
left=182;
menuheight=184;
top=41;
aI("image=/images/sl-s-overview-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-s-planning-mo.gif;url=#;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-s-architecture-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-s-engineering-mo.gif;url=#;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-s-interiors-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-s-infrastructure-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
}

with(milonic=new menuname("markets")){
style=menuStyle;
overflow="scroll";
left=182;
menuheight=184;
top=41;
aI("image=/images/sl-m-aviation-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-m-corp-mo.gif;url=#;imagewidth=93;imageheight=17;title=;");
aI("image=/images/sl-m-gaming-mo.gif;url=#;imagewidth=93;imageheight=18;title=;");
aI("image=/images/sl-m-gov-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-m-health-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-m-edu-mo.gif;url=#;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-m-hospitality-mo.gif;url=#;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-m-interiors-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-m-lib-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-m-manu-mo.gif;url=#;imagewidth=93;imageheight=17;title=;");
aI("image=/images/sl-m-plan-mo.gif;url=#;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-m-culture-mo.gif;url=#;imagewidth=93;imageheight=29;title=;");
aI("image=/images/sl-m-religious-mo.gif;url=#;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-m-retail-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-m-tech-mo.gif;url=#;imagewidth=93;imageheight=20;title=;");
aI("image=/images/sl-m-sports-mo.gif;url=#;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-m-international-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");

}

with(milonic=new menuname("knowledge")){
style=menuStyle;
overflow="scroll";
left=182;
menuheight=184;
top=41;
aI("image=/images/sl-ki-leadership-mo.gif;url=#;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-ki-trends-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
aI("image=/images/sl-ki-position-mo.gif;url=#;imagewidth=93;imageheight=9;title=;");
aI("image=/images/sl-ki-case-mo.gif;url=#;imagewidth=93;imageheight=7;title=;");
}

with(milonic=new menuname("locations")){
style=menuStyle;
overflow="scroll";
left=182;
menuheight=184;
top=41;
aI("image=/images/sl-l-daly-mo.gif;url=#;imagewidth=93;imageheight=7;title=");
aI("image=/images/sl-l-international-mo.gif;url=#;imagewidth=93;imageheight=18;title=");
aI("image=/images/sl-l-lan-mo.gif;url=#;imagewidth=93;imageheight=20;title=");
}

with(milonic=new menuname("careers")){
style=menuStyle;
overflow="scroll";
left=182;
menuheight=184;
top=41;
aI("image=/images/sl-c-culture-mo.gif;url=#;imagewidth=93;imageheight=9;title=");
aI("image=/images/sl-c-profiles-mo.gif;url=#;imagewidth=93;imageheight=9;title=");
aI("image=/images/sl-c-openings-mo.gif;url=#;imagewidth=93;imageheight=9;title=");
aI("image=/images/sl-c-university-mo.gif;url=#;imagewidth=93;imageheight=20;title=");
}

drawMenus();