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:48
Mouseover Problems
Poster: lesley
Dated: Wednesday April 6 2005 - 16:32:37 BST
I've set up a menu at http://www.advertisebydesign.co.uk/milonic/ and when I mouseover any of the menu items they are very slow to load the image, leaving the menu item with a transparent background. Even once they've loaded if you move up and down the list quickly they don't show properly.
This only happens in IE - Firefox and Opera have no problem at all. I am using the latest version of the menu.
I've tried preloading the images in the body tag but it makes no difference.
Can anyone help?
The code is:
Code:
with(background=new mm_style()){
bgimage="menujs/submenu.gif";
borderstyle="solid";
fontfamily="Arial";
fontsize="12px";
fontstyle="normal";
fontweight="normal";
image="menujs/transparent.gif";
imagepadding=4;
itemheight=25;
itemwidth=150;
offcolor="#FFFFFF";
oncolor="#D6E6FE";
overbgimage="menujs/menu_on.gif";
subimage="menujs/arrow_down.gif";
subimagepadding=8;
}
with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
itemheight=25;
itemwidth=150;
left=30;
orientation="horizontal";
style=background;
top=100;
aI("bgimage=menujs/menu_off.gif;image=menujs/blank.gif;overbgimage=menujs/menu_on.gif;status=Who we are ;text=Who we are;url=who.php;");
aI("bgimage=menujs/menu_off.gif;image=menujs/blank.gif;overbgimage=menujs/menu_on.gif;showmenu=What;text=What we do;url=what.php;");
aI("bgimage=menujs/menu_off.gif;image=menujs/blank.gif;overbgimage=menujs/menu_on.gif;showmenu=How;text=How we deliver;url=how.php;");
aI("bgimage=menujs/menu_off.gif;image=menujs/blank.gif;overbgimage=menujs/menu_on.gif;showmenu=Offer;text=What we offer;url=offer.php;");
aI("bgimage=menujs/menu_off.gif;image=menujs/blank.gif;overbgimage=menujs/menu_on.gif;status=Contact;text=Contact us;url=contact.php;");
}
with(milonic=new menuname("What")){
style=background;
itemheight=55;
itemwidth=250;
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu1;showmenu=PWM;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu2;showmenu=Der;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu3;showmenu=Str;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu4;showmenu=Hig;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu5;showmenu=Lev;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu6;showmenu=DCMO;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu7;showmenu=IRTT;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu8;showmenu=Hed;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu9;showmenu=Hes;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu10;showmenu=Sec;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu11;showmenu=Ass;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu12;showmenu=FoF;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu13;showmenu=Cas;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu14;showmenu=Fix;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu15;showmenu=UKI;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu16;showmenu=Mid;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu17;showmenu=Inv;");
}
with(milonic=new menuname("PWM")){
style=background;
itemheight=55;
itemwidth=311;
aI("fontsize=11px;bgimage=menujs/submenuxlg.gif;image=menujs/blank.gif;overbgimage=menujs/submenuxlg.gif;text=Menu 1 Team;url=team.php;");
aI("fontsize=11px;bgimage=menujs/submenuxlg.gif;image=menujs/blank.gif;overbgimage=menujs/submenuxlg.gif;text=Menu 1 Track Record;url=track.php/;");
}
with(milonic=new menuname("Der")){
style=background;
itemheight=55;
itemwidth=311;
aI("fontsize=11px;bgimage=menujs/submenuxlg.gif;image=menujs/blank.gif;overbgimage=menujs/submenuxlg.gif;text=Menu 2 Team;url=team.php;");
aI("fontsize=11px;bgimage=menujs/submenuxlg.gif;image=menujs/blank.gif;overbgimage=menujs/submenuxlg.gif;text=Menu 2Track Record;url=track.php/;");
}
bgimage="menujs/submenu.gif";
borderstyle="solid";
fontfamily="Arial";
fontsize="12px";
fontstyle="normal";
fontweight="normal";
image="menujs/transparent.gif";
imagepadding=4;
itemheight=25;
itemwidth=150;
offcolor="#FFFFFF";
oncolor="#D6E6FE";
overbgimage="menujs/menu_on.gif";
subimage="menujs/arrow_down.gif";
subimagepadding=8;
}
with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
itemheight=25;
itemwidth=150;
left=30;
orientation="horizontal";
style=background;
top=100;
aI("bgimage=menujs/menu_off.gif;image=menujs/blank.gif;overbgimage=menujs/menu_on.gif;status=Who we are ;text=Who we are;url=who.php;");
aI("bgimage=menujs/menu_off.gif;image=menujs/blank.gif;overbgimage=menujs/menu_on.gif;showmenu=What;text=What we do;url=what.php;");
aI("bgimage=menujs/menu_off.gif;image=menujs/blank.gif;overbgimage=menujs/menu_on.gif;showmenu=How;text=How we deliver;url=how.php;");
aI("bgimage=menujs/menu_off.gif;image=menujs/blank.gif;overbgimage=menujs/menu_on.gif;showmenu=Offer;text=What we offer;url=offer.php;");
aI("bgimage=menujs/menu_off.gif;image=menujs/blank.gif;overbgimage=menujs/menu_on.gif;status=Contact;text=Contact us;url=contact.php;");
}
with(milonic=new menuname("What")){
style=background;
itemheight=55;
itemwidth=250;
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu1;showmenu=PWM;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu2;showmenu=Der;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu3;showmenu=Str;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu4;showmenu=Hig;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu5;showmenu=Lev;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu6;showmenu=DCMO;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu7;showmenu=IRTT;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu8;showmenu=Hed;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu9;showmenu=Hes;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu10;showmenu=Sec;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu11;showmenu=Ass;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu12;showmenu=FoF;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu13;showmenu=Cas;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu14;showmenu=Fix;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu15;showmenu=UKI;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu16;showmenu=Mid;");
aI("fontsize=11px;subimage=menujs/arrow_right.gif;bgimage=menujs/submenulg.gif;image=menujs/blank.gif;overbgimage=menujs/submenulg.gif;text=Menu17;showmenu=Inv;");
}
with(milonic=new menuname("PWM")){
style=background;
itemheight=55;
itemwidth=311;
aI("fontsize=11px;bgimage=menujs/submenuxlg.gif;image=menujs/blank.gif;overbgimage=menujs/submenuxlg.gif;text=Menu 1 Team;url=team.php;");
aI("fontsize=11px;bgimage=menujs/submenuxlg.gif;image=menujs/blank.gif;overbgimage=menujs/submenuxlg.gif;text=Menu 1 Track Record;url=track.php/;");
}
with(milonic=new menuname("Der")){
style=background;
itemheight=55;
itemwidth=311;
aI("fontsize=11px;bgimage=menujs/submenuxlg.gif;image=menujs/blank.gif;overbgimage=menujs/submenuxlg.gif;text=Menu 2 Team;url=team.php;");
aI("fontsize=11px;bgimage=menujs/submenuxlg.gif;image=menujs/blank.gif;overbgimage=menujs/submenuxlg.gif;text=Menu 2Track Record;url=track.php/;");
}
Poster: Ruth
Dated: Wednesday April 6 2005 - 18:39:51 BST
Downlaod the Image Pre-loading module. Upload the module and place the call for it after the menus have been built i.e. after the call for the menus.
Code:
<script language="JavaScript1.2" type="text/javascript" src="preloadmenuimages.js"></script>
using your own path to the module.
Ruth
Poster: John
Dated: Wednesday April 6 2005 - 19:57:09 BST
First thing I'd do is build a second style for the menus starting with 'What' and below. Get all that stuff out of there that should be in a style.
You also have a lot in your Main Menu that can go back into the existing style.
Poster: lesley
Dated: Thursday April 7 2005 - 9:59:03 BST
Many thanks for your help. I've done both of those but it doesn't seem to have made any difference. I reduced the number of menu items to see if that was a problem but again no difference.
I've included my updated code and any further suggestions would be greatly appreciated.
Code:
_menuCloseDelay=500;
_menuOpenDelay=150;
_subOffsetTop=0;
_subOffsetLeft=0;
with(background=new mm_style()){
bgimage="menujs/menu_on.gif";
borderstyle="solid";
fontfamily="Arial";
fontsize="12px";
fontstyle="normal";
fontweight="normal";
image="menujs/blank.gif";
imagepadding=4;
itemheight=25;
itemwidth=150;
offcolor="#FFFFFF";
oncolor="#D6E6FE";
overbgimage="menujs/menu_on.gif";
subimage="menujs/arrow_down.gif";
subimagepadding=8;
}
with(submenu=new mm_style()){
bgimage="menujs/submenuxlg.gif";
borderstyle="solid";
fontfamily="Arial";
fontsize="11px";
fontstyle="normal";
fontweight="normal";
image="menujs/blank.gif";
imagepadding=4;
itemheight=25;
itemwidth=250;
offcolor="#FFFFFF";
oncolor="#D6E6FE";
overbgimage="menujs/submenuxlg.gif";
subimage="menujs/arrow_down.gif";
subimagepadding=8;
}
with(submenu2=new mm_style()){
bgimage="menujs/submenuxlg.gif";
borderstyle="solid";
fontfamily="Arial";
fontsize="11px";
fontstyle="normal";
fontweight="normal";
image="menujs/blank.gif";
imagepadding=4;
itemheight=25;
itemwidth=311;
offcolor="#FFFFFF";
oncolor="#D6E6FE";
overbgimage="menujs/submenuxlg.gif";
subimage="menujs/arrow_down.gif";
subimagepadding=8;
}
with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
itemheight=25;
itemwidth=150;
left=30;
orientation="horizontal";
style=background;
top=100;
aI("status=Who we are ;text=Who we are;url=who.php;");
aI("showmenu=What;text=What we do;url=what.php;");
aI("showmenu=How;text=How we deliver;url=how.php;");
aI("showmenu=Offer;text=What we offer;url=offer.php;");
aI("status=Contact;text=Contact us;url=contact.php;");
}
with(milonic=new menuname("What")){
style=submenu;
aI("text=Menu1;showmenu=PWM;");
aI("text=Menu2;showmenu=Der;");
aI("text=Menu3;showmenu=Str;");
aI("text=Menu4;showmenu=Hig;");
}
with(milonic=new menuname("PWM")){
style=submenu2;
aI("text=Menu 1 Team;url=team.php;");
aI("text=Menu 1 Track Record;url=track.php/;");
}
with(milonic=new menuname("Der")){
style=submenu2;
aI("text=Menu 2 Team;url=team.php;");
aI("text=Menu 2 Track Record;url=track.php/;");
}
with(milonic=new menuname("Str")){
style=submenu2;
aI("text=Menu 3 Team;url=sp_team.php;");
aI("text=Menu 3 Track Record;url=sp_track.php/;");
}
with(milonic=new menuname("Hig")){
style=submenu2;
aI("text=Menu 4 Team;url=team.php;");
aI("text=Menu 4 Track Record;url=track.php/;");
}
with(milonic=new menuname("How")){
style=submenu;
aI("status=Case history one;text=Case history one;url=http://www.caseHistory.php/;");
aI("status=Case history two;text=Case history two;url=http://www.caseHistory.php/;");
}
with(milonic=new menuname("Offer")){
style=submenu;
aI("text=Candidates;url=candidates.htm;");
aI("text=Employees;url=employees.htm;");
}
drawMenus();
_menuCloseDelay=500;
_menuOp
_menuOpenDelay=150;
_subOffsetTop=0;
_subOffsetLeft=0;
with(background=new mm_style()){
bgimage="menujs/menu_on.gif";
borderstyle="solid";
fontfamily="Arial";
fontsize="12px";
fontstyle="normal";
fontweight="normal";
image="menujs/blank.gif";
imagepadding=4;
itemheight=25;
itemwidth=150;
offcolor="#FFFFFF";
oncolor="#D6E6FE";
overbgimage="menujs/menu_on.gif";
subimage="menujs/arrow_down.gif";
subimagepadding=8;
}
with(submenu=new mm_style()){
bgimage="menujs/submenuxlg.gif";
borderstyle="solid";
fontfamily="Arial";
fontsize="11px";
fontstyle="normal";
fontweight="normal";
image="menujs/blank.gif";
imagepadding=4;
itemheight=25;
itemwidth=250;
offcolor="#FFFFFF";
oncolor="#D6E6FE";
overbgimage="menujs/submenuxlg.gif";
subimage="menujs/arrow_down.gif";
subimagepadding=8;
}
with(submenu2=new mm_style()){
bgimage="menujs/submenuxlg.gif";
borderstyle="solid";
fontfamily="Arial";
fontsize="11px";
fontstyle="normal";
fontweight="normal";
image="menujs/blank.gif";
imagepadding=4;
itemheight=25;
itemwidth=311;
offcolor="#FFFFFF";
oncolor="#D6E6FE";
overbgimage="menujs/submenuxlg.gif";
subimage="menujs/arrow_down.gif";
subimagepadding=8;
}
with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
itemheight=25;
itemwidth=150;
left=30;
orientation="horizontal";
style=background;
top=100;
aI("status=Who we are ;text=Who we are;url=who.php;");
aI("showmenu=What;text=What we do;url=what.php;");
aI("showmenu=How;text=How we deliver;url=how.php;");
aI("showmenu=Offer;text=What we offer;url=offer.php;");
aI("status=Contact;text=Contact us;url=contact.php;");
}
with(milonic=new menuname("What")){
style=submenu;
aI("text=Menu1;showmenu=PWM;");
aI("text=Menu2;showmenu=Der;");
aI("text=Menu3;showmenu=Str;");
aI("text=Menu4;showmenu=Hig;");
}
with(milonic=new menuname("PWM")){
style=submenu2;
aI("text=Menu 1 Team;url=team.php;");
aI("text=Menu 1 Track Record;url=track.php/;");
}
with(milonic=new menuname("Der")){
style=submenu2;
aI("text=Menu 2 Team;url=team.php;");
aI("text=Menu 2 Track Record;url=track.php/;");
}
with(milonic=new menuname("Str")){
style=submenu2;
aI("text=Menu 3 Team;url=sp_team.php;");
aI("text=Menu 3 Track Record;url=sp_track.php/;");
}
with(milonic=new menuname("Hig")){
style=submenu2;
aI("text=Menu 4 Team;url=team.php;");
aI("text=Menu 4 Track Record;url=track.php/;");
}
with(milonic=new menuname("How")){
style=submenu;
aI("status=Case history one;text=Case history one;url=http://www.caseHistory.php/;");
aI("status=Case history two;text=Case history two;url=http://www.caseHistory.php/;");
}
with(milonic=new menuname("Offer")){
style=submenu;
aI("text=Candidates;url=candidates.htm;");
aI("text=Employees;url=employees.htm;");
}
drawMenus();
_menuCloseDelay=500;
_menuOp
Many thanks