Hello, i am trying to implement the Milonic menu on this page
http://www.celebrityentourage.com/index.php. I am using the latest menu downloaded from the website 1 day ago.
I have read the how to's and tips on how to implement the menu into tables but i am having problems making it to work properly in Safari. On all other browsers i have tested it works fine (WIN IE&FF, and Mac FF) but on safari the sub-menus when they open they go over the main menu bar.
You can see how it looks here:
http://www.celebrityentourage.com/safari_error.jpg
I do believe i have used all the tricks with position="relative", putting all the files immediately after the <body> and in the same cell as the menu. I used buildAfterLoad=true; and all that Jazz but i am not able to make it look properly in Safari.
Anything i am missing?
Thanks in advance for your help.
Safari problem top offset
Actually your setup is incorrect for use in a td. See this page for instructions.
If you're still stuck just let us know.
If you're still stuck just let us know.
John
As i told before i actually tried a lot before putting the message he but anyway, i have made the following changes to the page so it is exactly how the example is:
1) moved the menu files to be included immediately after the body.
2) i put the submenu definition at the top of the main menu one.
3) position="relative" was already in
4) i removed some of the extra not necessary options.
The only thing that is diffrent is that the menu information is not in a file. Is that it? Anything else i missed because the menu looks the same in Safari.
1) moved the menu files to be included immediately after the body.
2) i put the submenu definition at the top of the main menu one.
3) position="relative" was already in
4) i removed some of the extra not necessary options.
The only thing that is diffrent is that the menu information is not in a file. Is that it? Anything else i missed because the menu looks the same in Safari.
Hi,
I'm not sure, but you might try the new method for placing the menu in the table.
Your data file would be this, save it as test_data.js, if you change the name then change the call for the file also.
It now contains everything and you have buildAfterLoad=true; at the top. This allows you to put it all in the same file.
Now, call all the files in that table cell
See if that works. If it doesn't, you will need to check your css. There is probably something in it that is causing that offset. Something to do with margin, padding or some generic TD code. I'm sorry I don't have Safari so I can't actually test this, I can only give you some direction.
NOTE: in your style you have in the submenu style subimage repeated twice and subimagepadding repeated. You might pick one of those.
Ruth
I'm not sure, but you might try the new method for placing the menu in the table.
Your data file would be this, save it as test_data.js, if you change the name then change the call for the file also.
Code: Select all
_menuCloseDelay=50;
_menuOpenDelay=50;
_followSpeed=5;
_followRate=40;
_subOffsetTop=0;
_subOffsetLeft=0;
_scrollAmount=3;
_scrollDelay=20;
buildAfterLoad=true;
with(menuStyle=new mm_style()){
alwaysvisible=1;
oncolor="#FC1921";
offcolor="#FFFFFF";
borderstyle="solid";
borderwidth=0;
separatorcolor="#FFFFFF";
separatorsize=0;
padding=2;
fontsize=12;
fontstyle="normal";
fontweight="bold";
fontfamily="Helvetica";
separatorpadding="0px";
subimage= _menu_image;
subimagepadding=5;
overfilter="Fade(duration=0.1);Alpha(opacity=100);";
outfilter="randomdissolve(duration=0.1)";
}
with(submenuStyle=new mm_style()){
oncolor="#FC1921";
offcolor="#FFFFFF";
onbgcolor="#1F1F1F";
offbgcolor="#000000";
bordercolor="#D3DAE0";
borderstyle="solid";
borderwidth=0;
separatorcolor="#FFFFFF";
separatorsize=1;
padding=3;
fontsize=11;
fontstyle="normal";
fontweight="normal";
fontfamily="Verdana";
subimage=_submenu_image;
subimagepadding=0;
overfilter="Alpha(opacity=100);";
subimage="arrow.gif";
subimagepadding=6;
}
with(milonic=new menuname("Main Menu")){
style=menuStyle;
alwaysvisible=1;
orientation="horizontal";
position="relative";
aI("image=http://www.celebrityentourage.com/uploaded_files/wysiwyg_image_uploads/menu/buttons/home.gif;overimage=home_over.gif;url=index.php;pagematch=index.php;");
aI("image=http://www.celebrityentourage.com/uploaded_files/wysiwyg_image_uploads/menu/buttons/entertainment.gif;overimage=http://www.celebrityentourage.com/uploaded_files/wysiwyg_image_uploads/menu/buttons/entertainment_over.gif;url=celebrity_list.php?category_id=1;pagematch=celebrity_list.php?category_id=1;showmenu=menu1;");
aI("image=http://www.celebrityentourage.com/uploaded_files/wysiwyg_image_uploads/menu/buttons/music.gif;overimage=http://www.celebrityentourage.com/uploaded_files/wysiwyg_image_uploads/menu/buttons/music_over.gif;url=celebrity_list.php?category_id=2;pagematch=celebrity_list.php?category_id=2;showmenu=menu2;");
aI("image=http://www.celebrityentourage.com/uploaded_files/wysiwyg_image_uploads/menu/buttons/sport.gif;overimage=http://www.celebrityentourage.com/uploaded_files/wysiwyg_image_uploads/menu/buttons/sport_over.gif;url=celebrity_list.php?category_id=3;pagematch=celebrity_list.php?category_id=3;showmenu=menu3;");
aI("image=http://www.celebrityentourage.com/uploaded_files/wysiwyg_image_uploads/menu/buttons/media.gif;overimage=http://www.celebrityentourage.com/uploaded_files/wysiwyg_image_uploads/menu/buttons/media_over.gif;url=celebrity_list.php?category_id=4;pagematch=celebrity_list.php?category_id=4;showmenu=menu4;");
aI("image=http://www.celebrityentourage.com/uploaded_files/wysiwyg_image_uploads/menu/buttons/fashion.gif;overimage=http://www.celebrityentourage.com/uploaded_files/wysiwyg_image_uploads/menu/buttons/fashion_over.gif;url=celebrity_list.php?category_id=5;pagematch=celebrity_list.php?category_id=5;showmenu=menu5;");
aI("image=http://www.celebrityentourage.com/uploaded_files/wysiwyg_image_uploads/menu/buttons/food_and_wine.gif;overimage=http://www.celebrityentourage.com/uploaded_files/wysiwyg_image_uploads/menu/buttons/food_and_wine_over.gif;url=celebrity_list.php?category_id=6;pagematch=celebrity_list.php?category_id=6;showmenu=menu6;");
aI("image=http://www.celebrityentourage.com/uploaded_files/wysiwyg_image_uploads/menu/buttons/personalities.gif;overimage=http://www.celebrityentourage.com/uploaded_files/wysiwyg_image_uploads/menu/buttons/personalities_over.gif;url=celebrity_list.php?category_id=7;pagematch=celebrity_list.php?category_id=7;");
aI("image=http://www.celebrityentourage.com/uploaded_files/wysiwyg_image_uploads/menu/buttons/ambassadors.gif;overimage=http://www.celebrityentourage.com/uploaded_files/wysiwyg_image_uploads/menu/buttons/ambassadors_over.gif;url=ambassador_list.php?category_id=8;pagematch=ambassador_list.php?category_id=8;showmenu=menu8;");
}
with(milonic=new menuname("menu1")){
style=submenuStyle;
aI("text=Actors;status=Actors;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=9;pagematch=celebrity_list.php?category_id=9;");
aI("text=Arts;status=Arts;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=20;pagematch=celebrity_list.php?category_id=20;showmenu=menu20;");
aI("text=Authors;status=Authors;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=23;pagematch=celebrity_list.php?category_id=23;");
aI("text=Comedy;status=Comedy;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=13;pagematch=celebrity_list.php?category_id=13;");
aI("text=Directors;status=Directors;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=24;pagematch=celebrity_list.php?category_id=24;");
aI("text=Hosts & Presenters;status=Hosts & Presenters;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=10;pagematch=celebrity_list.php?category_id=10;showmenu=menu10;");
aI("text=Producers;status=Producers;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=26;pagematch=celebrity_list.php?category_id=26;");
aI("text=Radio;status=Radio;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=12;pagematch=celebrity_list.php?category_id=12;");
aI("text=Reality;status=Reality;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=11;pagematch=celebrity_list.php?category_id=11;showmenu=menu11;");
aI("text=Writers;status=Writers;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=27;pagematch=celebrity_list.php?category_id=27;");
}
with(milonic=new menuname("menu20")){
style=submenuStyle;
aI("text=Performing arts;status=Performing arts;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=21;pagematch=celebrity_list.php?category_id=21;");
aI("text=Visual arts;status=Visual arts;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=22;pagematch=celebrity_list.php?category_id=22;");
}
with(milonic=new menuname("menu10")){
style=submenuStyle;
aI("text=Children;status=Children;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=16;pagematch=celebrity_list.php?category_id=16;");
aI("text=Entertainment;status=Entertainment;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=17;pagematch=celebrity_list.php?category_id=17;");
aI("text=Lifestyle;status=Lifestyle;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=18;pagematch=celebrity_list.php?category_id=18;");
aI("text=News;status=News;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=93;pagematch=celebrity_list.php?category_id=93;");
aI("text=Sport;status=Sport;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=89;pagematch=celebrity_list.php?category_id=89;");
}
with(milonic=new menuname("menu11")){
style=submenuStyle;
aI("text=Australian Idol;status=Australian Idol;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=97;pagematch=celebrity_list.php?category_id=97;");
aI("text=Biggest Loser;status=Biggest Loser;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=94;pagematch=celebrity_list.php?category_id=94;");
aI("text=Bondi Rescue;status=Bondi Rescue;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=90;pagematch=celebrity_list.php?category_id=90;");
aI("text=Dancing with the Stars;status=Dancing with the Stars;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=98;pagematch=celebrity_list.php?category_id=98;");
aI("text=It Takes Two;status=It Takes Two;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=87;pagematch=celebrity_list.php?category_id=87;");
aI("text=TV Judge;status=TV Judge;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=85;pagematch=celebrity_list.php?category_id=85;");
}
with(milonic=new menuname("menu2")){
style=submenuStyle;
aI("text=Bands;status=Bands;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=28;pagematch=celebrity_list.php?category_id=28;showmenu=menu28;");
aI("text=Composers;status=Composers;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=38;pagematch=celebrity_list.php?category_id=38;");
aI("text=DJ's;status=DJ's;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=39;pagematch=celebrity_list.php?category_id=39;");
aI("text=Hosts & Presenters;status=Hosts & Presenters;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=100;pagematch=celebrity_list.php?category_id=100;");
aI("text=Musical Theatre;status=Musical Theatre;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=88;pagematch=celebrity_list.php?category_id=88;");
aI("text=Producers;status=Producers;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=103;pagematch=celebrity_list.php?category_id=103;");
aI("text=Solo Artists;status=Solo Artists;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=42;pagematch=celebrity_list.php?category_id=42;showmenu=menu42;");
}
with(milonic=new menuname("menu28")){
style=submenuStyle;
aI("text=Alternative;status=Alternative;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=29;pagematch=celebrity_list.php?category_id=29;");
aI("text=Children;status=Children;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=96;pagematch=celebrity_list.php?category_id=96;");
aI("text=Classical;status=Classical;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=30;pagematch=celebrity_list.php?category_id=30;");
aI("text=Country;status=Country;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=31;pagematch=celebrity_list.php?category_id=31;");
aI("text=Electronic;status=Electronic;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=32;pagematch=celebrity_list.php?category_id=32;");
aI("text=Hip Hop / Rap;status=Hip Hop / Rap;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=34;pagematch=celebrity_list.php?category_id=34;");
aI("text=Indie;status=Indie;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=33;pagematch=celebrity_list.php?category_id=33;");
aI("text=Jazz;status=Jazz;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=35;pagematch=celebrity_list.php?category_id=35;");
aI("text=Pop;status=Pop;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=36;pagematch=celebrity_list.php?category_id=36;");
aI("text=Punk;status=Punk;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=102;pagematch=celebrity_list.php?category_id=102;");
aI("text=Rock;status=Rock;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=37;pagematch=celebrity_list.php?category_id=37;");
}
with(milonic=new menuname("menu42")){
style=submenuStyle;
aI("text=Alternate;status=Alternate;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=43;pagematch=celebrity_list.php?category_id=43;");
aI("text=Classical;status=Classical;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=44;pagematch=celebrity_list.php?category_id=44;");
aI("text=Country;status=Country;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=45;pagematch=celebrity_list.php?category_id=45;");
aI("text=Electronic;status=Electronic;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=46;pagematch=celebrity_list.php?category_id=46;");
aI("text=Hip Hop / Rap;status=Hip Hop / Rap;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=48;pagematch=celebrity_list.php?category_id=48;");
aI("text=Indie;status=Indie;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=47;pagematch=celebrity_list.php?category_id=47;");
aI("text=Jazz;status=Jazz;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=49;pagematch=celebrity_list.php?category_id=49;");
aI("text=Pop;status=Pop;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=50;pagematch=celebrity_list.php?category_id=50;");
aI("text=Rock;status=Rock;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=51;pagematch=celebrity_list.php?category_id=51;");
}
with(milonic=new menuname("menu3")){
style=submenuStyle;
aI("text=Commentators;status=Commentators;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=52;pagematch=celebrity_list.php?category_id=52;");
aI("text=Hosts & Presenters;status=Hosts & Presenters;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=54;pagematch=celebrity_list.php?category_id=54;");
aI("text=Individual Athletes;status=Individual Athletes;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=53;pagematch=celebrity_list.php?category_id=53;");
aI("text=Teams;status=Teams;itemheight=20;itemwidth=180;url=team_list.php?category_id=56;pagematch=team_list.php?category_id=56;showmenu=menu56;");
aI("text=Umpires, Referees & Coaches;status=Umpires, Referees & Coaches;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=65;pagematch=celebrity_list.php?category_id=65;");
}
with(milonic=new menuname("menu56")){
style=submenuStyle;
aI("text=AFL;status=AFL;itemheight=20;itemwidth=180;url=team_list.php?category_id=57;pagematch=team_list.php?category_id=57;");
aI("text=ARU (Rugby Union);status=ARU (Rugby Union);itemheight=20;itemwidth=180;url=team_list.php?category_id=58;pagematch=team_list.php?category_id=58;");
aI("text=Basketball;status=Basketball;itemheight=20;itemwidth=180;url=team_list.php?category_id=59;pagematch=team_list.php?category_id=59;");
aI("text=Cricket;status=Cricket;itemheight=20;itemwidth=180;url=team_list.php?category_id=60;pagematch=team_list.php?category_id=60;");
aI("text=Hockey;status=Hockey;itemheight=20;itemwidth=180;url=team_list.php?category_id=61;pagematch=team_list.php?category_id=61;");
aI("text=Netball;status=Netball;itemheight=20;itemwidth=180;url=team_list.php?category_id=62;pagematch=team_list.php?category_id=62;");
aI("text=NRL (Rugby League);status=NRL (Rugby League);itemheight=20;itemwidth=180;url=team_list.php?category_id=63;pagematch=team_list.php?category_id=63;");
aI("text=Soccer;status=Soccer;itemheight=20;itemwidth=180;url=team_list.php?category_id=64;pagematch=team_list.php?category_id=64;");
}
with(milonic=new menuname("menu4")){
style=submenuStyle;
aI("text=Columnist;status=Columnist;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=91;pagematch=celebrity_list.php?category_id=91;");
aI("text=News & Current Affairs;status=News & Current Affairs;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=66;pagematch=celebrity_list.php?category_id=66;showmenu=menu66;");
aI("text=Photographers;status=Photographers;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=73;pagematch=celebrity_list.php?category_id=73;");
aI("text=Politics;status=Politics;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=71;pagematch=celebrity_list.php?category_id=71;");
aI("text=Publishers & Editors;status=Publishers & Editors;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=72;pagematch=celebrity_list.php?category_id=72;");
}
with(milonic=new menuname("menu66")){
style=submenuStyle;
aI("text=Anchors;status=Anchors;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=67;pagematch=celebrity_list.php?category_id=67;");
aI("text=Business / Finance;status=Business / Finance;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=68;pagematch=celebrity_list.php?category_id=68;");
aI("text=Journalists;status=Journalists;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=86;pagematch=celebrity_list.php?category_id=86;");
aI("text=Politics;status=Politics;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=95;pagematch=celebrity_list.php?category_id=95;");
aI("text=Weather;status=Weather;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=70;pagematch=celebrity_list.php?category_id=70;");
}
with(milonic=new menuname("menu5")){
style=submenuStyle;
aI("text=Beauty;status=Beauty;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=74;pagematch=celebrity_list.php?category_id=74;");
aI("text=Designers;status=Designers;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=75;pagematch=celebrity_list.php?category_id=75;");
aI("text=Models;status=Models;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=77;pagematch=celebrity_list.php?category_id=77;");
aI("text=Photographers;status=Photographers;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=78;pagematch=celebrity_list.php?category_id=78;");
}
with(milonic=new menuname("menu6")){
style=submenuStyle;
aI("text=Author;status=Author;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=99;pagematch=celebrity_list.php?category_id=99;");
aI("text=Chefs;status=Chefs;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=79;pagematch=celebrity_list.php?category_id=79;");
aI("text=Food;status=Food;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=80;pagematch=celebrity_list.php?category_id=80;");
aI("text=Restaurateurs;status=Restaurateurs;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=82;pagematch=celebrity_list.php?category_id=82;");
aI("text=Wine;status=Wine;itemheight=20;itemwidth=180;url=celebrity_list.php?category_id=83;pagematch=celebrity_list.php?category_id=83;");
}
with(milonic=new menuname("menu8")){
style=submenuStyle;
aI("text=Charities;status=Charities;itemheight=20;itemwidth=180;url=ambassador_list.php?category_id=14;pagematch=ambassador_list.php?category_id=14;");
aI("text=Corporate;status=Corporate;itemheight=20;itemwidth=180;url=ambassador_list.php?category_id=15;pagematch=ambassador_list.php?category_id=15;");
}
drawMenus();Now, call all the files in that table cell
Code: Select all
<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR>
<TD width=5 height=24><IMG alt=""
src="menu_left.jpg"></TD>
<TD class=top_menu width="100%" height=24><SCRIPT language=JavaScript src="http://www.celebrityentourage.com/common/menu/milonic_src.js"
type=text/javascript></SCRIPT>
<SCRIPT language=JavaScript>
if(ns4)_d.write("<scr"+"ipt language=JavaScript src=http://www.celebrityentourage.com/common/menu/mmenuns4.js></scr"+"ipt>");
else _d.write("<scr"+"ipt language=JavaScript src=http://www.celebrityentourage.com/common/menu/mmenudom.js></scr"+"ipt>"); </SCRIPT>
<SCRIPT language=JavaScript src="http://www.celebrityentourage.com/common/menu/test_data.js"
type=text/javascript></SCRIPT></TD>
<TD width=12 height=24><IMG alt=""
src="menu_right_for_columns.jpg"></TD></TR></TBODY></TABLE>NOTE: in your style you have in the submenu style subimage repeated twice and subimagepadding repeated. You might pick one of those.
Ruth
ok, i found the problem in the CSS. My site (body tag) had a top margin of 40. Because of that the menu appeared like it did in Safari. I have taken the top margin out (well i created it with a new table row or a div) and now the menu appears almost in the correct position (a few pixels too high still but i can live with that).
Thank you,
Mihai
Thank you,
Mihai