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

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();



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>


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


Poster: mattdean
Dated: Friday April 20 2007 - 20:24:51 BST

Thanks for your continued help Ruth


Poster: Ruth
Dated: Friday April 20 2007 - 20:33:30 BST

Hi,

Is the one you have up the one that has it 'over' the below part? I am not seeing it in FF anymore, which it was doing before in my 1.5. Is it still doing that in 2?

Ruth


Poster: mattdean
Dated: Friday April 20 2007 - 20:43:49 BST

Yes Still the same one up, and yes still the same problem in FF 2