Industrial Strength JavaScript and DHTML Menus
About Us
Testimonials
Contact Us
Our Distinguished Clients
Investing in Non-Profits
Where Are We
Privacy Policy
Software Licensing Agreement
DHTML JavaScript Menu
Product Information
Page Integration
Quick Reference Guides
Embedding Into a Table or DIV
Purchase
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:18
Menu positioning issue with Opera 9.50 only (menu ver 5.796)
Poster: cmanley
Dated: Monday June 23 2008 - 17:54:09 BST
Hi,
I'm using Milonic menu's version 5.796 in a new site I'm building. The menu's work just fine in IE6, IE7, Firefox 2, Firefox 3, and Opera 9.27, but not in Opera 9.50.
In Opera 9.50 the submenu's are very offset.
It's a very simple site actually. The menu is in a div that's located with in a container div. The container div is centered in the body and offset from the body top by a fixed distance.
Below is the relevant CSS, HTML, and Milonic code.
Thanks,
Craig Manley
The relevant CSS:
Code:
/* The container I mentioned (not to be confused with html frames btw): */
#frame {
margin-left: auto; margin-right: auto;
position: relative;
padding: 10px 10px 0 10px;
top: 120px;
width: 910px;
}
/* The menu sits in this and this sits in the #frame container: */
#menubar {
height: 40px;
background: url(/menu/main_inactive.gif) repeat-x;
position: relative;
}
#frame {
margin-left: auto; margin-right: auto;
position: relative;
padding: 10px 10px 0 10px;
top: 120px;
width: 910px;
}
/* The menu sits in this and this sits in the #frame container: */
#menubar {
height: 40px;
background: url(/menu/main_inactive.gif) repeat-x;
position: relative;
}
The relevant HTML:
Code:
<body>
<div id="frame">
<div id="menubar">
<script type="text/javascript" src="/menu/menuLoggedOut.js"></script>
</div>
<div>Content bla bla</div>
</div>
</body>
<div id="frame">
<div id="menubar">
<script type="text/javascript" src="/menu/menuLoggedOut.js"></script>
</div>
<div>Content bla bla</div>
</div>
</body>
The relevant Milonic code:
Code:
fixMozillaZIndex=true; //Fixes Z-Index problem with Mozilla browsers but causes odd scrolling problem, toggle to see if it helps
_menuCloseDelay=500;
_menuOpenDelay=150;
_subOffsetTop=2;
_subOffsetLeft=-2;
with(menuStyle=new mm_style()){
styleid=1;
fontfamily="Arial, Helvetica, sans-serif";
fontsize="14px";
offcolor="#fff";
oncolor="#a4cb88";
overbgimage="/menu/main_active.gif";
bgimage="/menu/main_inactive.gif";
rawcss="padding-left: 20px; padding-right: 20px";
separatorimage="/menu/main_sep.png";
separatorsize=1;
}
with(submenuStyle=new mm_style()){
styleid=2;
fontfamily="Arial, Helvetica, sans-serif";
fontsize="11px";
offcolor="#fff";
offbgcolor="#01a8e1";
oncolor="#a4cb88";
onbgcolor="#000";
onborder="1px solid #01a8e1";
rawcss="padding-left: 20px; padding-right: 20px";
}
with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
itemheight=39;
//itemwidth=181;
//minwidth
orientation="horizontal";
style=menuStyle;
aI("align=center;showmenu=Bedrijf;text=Bedrijf;");
aI("align=center;showmenu=Producten;text=Producten;");
aI(""); // force closing seperator
}
with(milonic=new menuname("Bedrijf")){
itemheight=25;
orientation="vertical";
style=submenuStyle;
aI("align=left;text=Virtuele rondleiding;url=/content.php?key=Virtuele%20rondleiding;");
aI("align=left;text=Historie;url=/content.php?key=Historie;");
aI("align=left;text=Missie / Visie;url=/content.php?key=Missie%20/%20Visie;");
}
with(milonic=new menuname("Producten")){
itemheight=25;
orientation="vertical";
style=submenuStyle;
aI("align=left;text=Medicatierol;url=/content.php?key=Medicatierol");
aI("align=left;text=Implementatie-module;url=/content.php?key=Implementatie-module;");
}
_menuCloseDelay=500;
_menuOpenDelay=150;
_subOffsetTop=2;
_subOffsetLeft=-2;
with(menuStyle=new mm_style()){
styleid=1;
fontfamily="Arial, Helvetica, sans-serif";
fontsize="14px";
offcolor="#fff";
oncolor="#a4cb88";
overbgimage="/menu/main_active.gif";
bgimage="/menu/main_inactive.gif";
rawcss="padding-left: 20px; padding-right: 20px";
separatorimage="/menu/main_sep.png";
separatorsize=1;
}
with(submenuStyle=new mm_style()){
styleid=2;
fontfamily="Arial, Helvetica, sans-serif";
fontsize="11px";
offcolor="#fff";
offbgcolor="#01a8e1";
oncolor="#a4cb88";
onbgcolor="#000";
onborder="1px solid #01a8e1";
rawcss="padding-left: 20px; padding-right: 20px";
}
with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
itemheight=39;
//itemwidth=181;
//minwidth
orientation="horizontal";
style=menuStyle;
aI("align=center;showmenu=Bedrijf;text=Bedrijf;");
aI("align=center;showmenu=Producten;text=Producten;");
aI(""); // force closing seperator
}
with(milonic=new menuname("Bedrijf")){
itemheight=25;
orientation="vertical";
style=submenuStyle;
aI("align=left;text=Virtuele rondleiding;url=/content.php?key=Virtuele%20rondleiding;");
aI("align=left;text=Historie;url=/content.php?key=Historie;");
aI("align=left;text=Missie / Visie;url=/content.php?key=Missie%20/%20Visie;");
}
with(milonic=new menuname("Producten")){
itemheight=25;
orientation="vertical";
style=submenuStyle;
aI("align=left;text=Medicatierol;url=/content.php?key=Medicatierol");
aI("align=left;text=Implementatie-module;url=/content.php?key=Implementatie-module;");
}
Re: Menu positioning issue with Opera 9.50 only (menu ver 5.796)
Poster: Ruth
Dated: Monday June 23 2008 - 19:55:07 BST
Hi,
The problem is from the css. I will post to Milonic, but it is coming from the #frame css
Code:
POSITION: relative; TOP: 120px
The submenus are being shifted down that 120px. I am trying to figure out how to set it up so that doesn't happen in Opera.
Ruth
Re: Menu positioning issue with Opera 9.50 only (menu ver 5.796)
Poster: cmanley
Dated: Tuesday June 24 2008 - 20:25:27 BST
I got it to work in Opera 9.50 by just adding this line to the list of globals:
Code:
buildAfterLoad=true; // For Opera 9.50.
Re: Menu positioning issue with Opera 9.50 only (menu ver 5.796)
Poster: Ruth
Dated: Tuesday June 24 2008 - 23:52:46 BST
That's great. Thanks so much for posting the solution, it is really appreciated
Ruth