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
Firefox positions dropdown menu in wrong place IE7 OK
Poster: mattdean
Dated: Thursday April 19 2007 - 19:10:12 BST
I am currently redeveloping our site http://beta.ultimate-pilates.co.uk dropdown menus are fine in IE7 but ofset wildly to the left in Firefox 2 and with no transparency. I think they were alright in both at the start of the project so it is probobly something I have done. Part of the menu is in a Table.
This is menu_data.js
Code:
_menuCloseDelay=500 // The time delay for menus to remain visible on mouse out
_menuOpenDelay=125 // The time delay before menus open on mouse over
_subOffsetTop=1 // Sub menu top offset
_subOffsetLeft=1 // Sub menu left offset
buildAfterLoad=true;
fixMozillaZIndex=true; //Fixes Z-Index problem with Mozilla browsers but causes odd scrolling problem, toggle to see if it helps
with(menuStyle=new mm_style()){
onbgcolor="#FFFFFF";
oncolor="#B81C8C";
offbgcolor="#B81C8C";
offcolor="#FFFFFF";
bordercolor="#FFFFFF";
borderstyle="solid";
borderwidth=0;
separatorcolor="#B81C8C";
separatorsize="0";
separatorpadding=10;
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color='#777777', Direction=135, Strength=5)";
margin=0;
padding=4;
fontsize="70%";
fontstyle="bold";
fontfamily="Verdana, Tahoma, Arial";
pagecolor="white";
pagebgcolor="#B81C8C";
headercolor="#000000";
headerbgcolor="#ffffff";
subimage="arrow.gif";
subimagepadding="2";
overfilter="Fade(duration=0.2);Alpha(opacity=77);Shadow(color='#FFFFFF', Direction=135, Strength=0)";
outfilter="fade(duration=0.3)";
}
/*with(milonic=new menuname("Main Menu")){
style=menuStyle;
top=110;
left=15;
alwaysvisible=1;
overflow="scroll";
aI("text=Home;url=http://beta.ultimate-pilates.co.uk/;status=Back To Home Page;");
aI("text=About Pilates;showmenu=About Pilates;");
aI("text=Classes;showmenu=Classes;");
aI("text=Online Booking;showmenu=Online Booking;");
aI("text=Merchandise;showmenu=Merchandise;");
aI("text=Customer Services;showmenu=Customer Services;");
aI("text=Terms & Conditions;url=http://www.ultimate-pilates.co.uk/;status=Terms & Conditions;");
aI("text=Links;showmenu=Links;");
}
*/
with(milonic=new menuname("About Pilates")){
style=menuStyle;
overflow="scroll";
aI("text=What is Pilates?;url=/what_is_pilates.htm;status=What is Pilates?;");
aI("text=Priciples of Pilates;url=/principles_of_pilates.htm;status=Priciples of Pilates;");
aI("text=About Ultimate Pilates;url=/about_ultimate_pilates.htm;status=About Ultimate Pilates;");
aI("text=About Joseph Pilates;url=/about_joseph_pilates.htm;status=About Joseph Pilates;");
aI("text=FAQ's;url=/faqs.htm;status=Frequently asked Questions;");
}
with(milonic=new menuname("Classes")){
style=menuStyle;
aI("text=About our Classes;url=/about_our_classes.htm;status=About our Classes;");
aI("text=Class Costs;url=/class_costs.htm;status=Class Costs;");
aI("text=Class Timetable;url=/timetable.htm;status=Timetable of Classes;");
aI("text=Course Year Planner;url=/year_planner.htm;status=Course Year Planner;");
aI("text=Workshop Classes;url=/workshop_classes.htm;status=Workshop Classes;");
}
with(milonic=new menuname("Online Booking")){
style=menuStyle;
aI("text=Book a Course Online;url=/book_online.htm;status=Book a Course Online;");
aI("text=Book a Beginners Workshop Online;url=https://ssl511.securepod.com/ultimate-pilates/wsxx_secure_new.asp;target=_blank;status=Book a Beginners Workshop Online;");
}
with(milonic=new menuname("Links")){
style=menuStyle;
aI("text=Our recommendations;url=/links.htm;status=Our recommendations;");
}
drawMenus();
_menuOpenDelay=125 // The time delay before menus open on mouse over
_subOffsetTop=1 // Sub menu top offset
_subOffsetLeft=1 // Sub menu left offset
buildAfterLoad=true;
fixMozillaZIndex=true; //Fixes Z-Index problem with Mozilla browsers but causes odd scrolling problem, toggle to see if it helps
with(menuStyle=new mm_style()){
onbgcolor="#FFFFFF";
oncolor="#B81C8C";
offbgcolor="#B81C8C";
offcolor="#FFFFFF";
bordercolor="#FFFFFF";
borderstyle="solid";
borderwidth=0;
separatorcolor="#B81C8C";
separatorsize="0";
separatorpadding=10;
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color='#777777', Direction=135, Strength=5)";
margin=0;
padding=4;
fontsize="70%";
fontstyle="bold";
fontfamily="Verdana, Tahoma, Arial";
pagecolor="white";
pagebgcolor="#B81C8C";
headercolor="#000000";
headerbgcolor="#ffffff";
subimage="arrow.gif";
subimagepadding="2";
overfilter="Fade(duration=0.2);Alpha(opacity=77);Shadow(color='#FFFFFF', Direction=135, Strength=0)";
outfilter="fade(duration=0.3)";
}
/*with(milonic=new menuname("Main Menu")){
style=menuStyle;
top=110;
left=15;
alwaysvisible=1;
overflow="scroll";
aI("text=Home;url=http://beta.ultimate-pilates.co.uk/;status=Back To Home Page;");
aI("text=About Pilates;showmenu=About Pilates;");
aI("text=Classes;showmenu=Classes;");
aI("text=Online Booking;showmenu=Online Booking;");
aI("text=Merchandise;showmenu=Merchandise;");
aI("text=Customer Services;showmenu=Customer Services;");
aI("text=Terms & Conditions;url=http://www.ultimate-pilates.co.uk/;status=Terms & Conditions;");
aI("text=Links;showmenu=Links;");
}
*/
with(milonic=new menuname("About Pilates")){
style=menuStyle;
overflow="scroll";
aI("text=What is Pilates?;url=/what_is_pilates.htm;status=What is Pilates?;");
aI("text=Priciples of Pilates;url=/principles_of_pilates.htm;status=Priciples of Pilates;");
aI("text=About Ultimate Pilates;url=/about_ultimate_pilates.htm;status=About Ultimate Pilates;");
aI("text=About Joseph Pilates;url=/about_joseph_pilates.htm;status=About Joseph Pilates;");
aI("text=FAQ's;url=/faqs.htm;status=Frequently asked Questions;");
}
with(milonic=new menuname("Classes")){
style=menuStyle;
aI("text=About our Classes;url=/about_our_classes.htm;status=About our Classes;");
aI("text=Class Costs;url=/class_costs.htm;status=Class Costs;");
aI("text=Class Timetable;url=/timetable.htm;status=Timetable of Classes;");
aI("text=Course Year Planner;url=/year_planner.htm;status=Course Year Planner;");
aI("text=Workshop Classes;url=/workshop_classes.htm;status=Workshop Classes;");
}
with(milonic=new menuname("Online Booking")){
style=menuStyle;
aI("text=Book a Course Online;url=/book_online.htm;status=Book a Course Online;");
aI("text=Book a Beginners Workshop Online;url=https://ssl511.securepod.com/ultimate-pilates/wsxx_secure_new.asp;target=_blank;status=Book a Beginners Workshop Online;");
}
with(milonic=new menuname("Links")){
style=menuStyle;
aI("text=Our recommendations;url=/links.htm;status=Our recommendations;");
}
drawMenus();
and the part embedded in the table
Code:
<SCRIPT TYPE="text/javascript">
with(milonic=new menuname("Main Menu")){
style=menuStyle;
position = "relative";
orientation="horizontal";
alwaysvisible=1;
overflow="scroll";
menualign='left'; //here//
aI("text=Home;url=http://beta.ultimate-pilates.co.uk;status=Back To Home Page;");
aI("text=About Pilates;showmenu=About Pilates;");
aI("text=Classes;showmenu=Classes;");
aI("text=Studio;url=/one2one.htm;status=Studio;");
aI("text=Online Booking;showmenu=Online Booking;");
aI("text=Contact us;url=/contact_us.htm;status=Contact us;");
aI("text=Terms & Conditions;url=/terms.htm;status=Terms & Conditions;");
aI("text=Links;showmenu=Links;");
}
drawMenus();
</SCRIPT>
with(milonic=new menuname("Main Menu")){
style=menuStyle;
position = "relative";
orientation="horizontal";
alwaysvisible=1;
overflow="scroll";
menualign='left'; //here//
aI("text=Home;url=http://beta.ultimate-pilates.co.uk;status=Back To Home Page;");
aI("text=About Pilates;showmenu=About Pilates;");
aI("text=Classes;showmenu=Classes;");
aI("text=Studio;url=/one2one.htm;status=Studio;");
aI("text=Online Booking;showmenu=Online Booking;");
aI("text=Contact us;url=/contact_us.htm;status=Contact us;");
aI("text=Terms & Conditions;url=/terms.htm;status=Terms & Conditions;");
aI("text=Links;showmenu=Links;");
}
drawMenus();
</SCRIPT>
This last part is in a DWT file.
Any help much appreciated
Poster: Ruth
Dated: Thursday April 19 2007 - 20:06:23 BST
Hi,
It's setting the position of the table to relative that is causing that. Remove that and everything is fine. FF must be applying that to the menu programming and setting the position of submenus 'relatively'
Ruth
FF positions dropdown menus incorrectly
Poster: mattdean
Dated: Thursday April 19 2007 - 20:42:35 BST
Ruth thanks for your speedy response I had already tried that but that make the menu overhang the content region and puts a line along side the menu.
i have left the changes on our site beta.ultimate-pilates.co.uk so you can see the results this shows in both IE7 and FF
Any ideas?
Poster: Ruth
Dated: Thursday April 19 2007 - 22:27:34 BST
Hi,
You misunderstood. You can't remove the position="relative"; from the menu, that has to be there if it's in a table. It is the table you have set to position:relative; that is what has to be removed.
Why do you have the table itself set as position:relative;?
Ruth
Poster: mattdean
Dated: Friday April 20 2007 - 13:24:49 BST
Ruth thanks for that have changed the table to static the menus drop in the right place but the top menu item now obscures the menu heading, I have left the site in this state do you can see.
Also is opacity level not supported by FF?
Many thanks for your help to date!
Poster: Ruth
Dated: Friday April 20 2007 - 16:16:27 BST
Hi,
Yes you can get opacity in FF but it has to be done through css. That overfilter outfilter is proprietary to IE, it is the IE transitions and filters applied through activeX I think. Try this topic for more explanations on how to set those in FF and Safari, but they are not really the over/outfilters, that is just opacity which is the only thing I think can be applied. Unfortunately when applied it applies to the whole menu, menu, colors and text.
http://www.milonic.com/forum/viewtopic. ... 0840#20840
As to the other, I'll post back. I have a dentist appointment this morning,
so will not get to it until later.
Ruth