menubgimage not appearing w/buildAfterLoad

[SOCO]

I am new to Milonic menus (and CSS for that matter). I am attempting to give my non-profit website a face lift using Milonic menus. I am using a 2-layered horizontal menu based upon "Milonic Home Menu". I downloaded the latest menu version this morning, 5.754. My menu is embedded in a table within a DIV using the buildAfterLoad property. Unfortunately, if I set buildAfterLoad=true then my submenu graphic (from menubgimage) disappears and the submenus are all transparent (from offbgcolor). If I set buildAfterLoad=false then the menubgimage appears just fine but the menus are offset to the right by approximately 1". My sample page with buildAfterLoad=true is:

http://www.specialolympicsco.org/index6.html

What I would like is the buildAfterLoad=true with my menubgimage on the submenu. Any help would be greatly appreciated.


My menu_data.js is as follows:

Code: Select all

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=0;
_subOffsetLeft=0;

horizontalMenuDelay="1";
buildAfterLoad=true;

with(horizStyle=new mm_style()){
//********CHANGE BELOW FOR BACKGROUND IMAGE**********
bgimage="images/menu/backgrd_menu.gif";
bordercolor="#999999";
borderstyle="solid";
borderwidth=1;
fontfamily="arial, tahoma";
fontsize="100%";
fontstyle="normal";
fontweight="bold";
//********CHANGE BELOW FOR BACKGROUND COLOR**********
offbgcolor="#0033CC";
offcolor="#000000";
onbgcolor="#FEFAD2";
onborder="1px solid #999999";
oncolor="#000000";
onsubimage="images/menu/on_downboxed.gif";
overbgimage="images/menu/backon_beige.gif";
padding=3;
pageimage="images/menu/db_red.gif";
separatoralign="right";
separatorcolor="#999999";
separatorpadding=1;
separatorheight="100%";
separatorsize=1;
subimage="images/menu/downboxed.gif";
}

with(vertStyle=new mm_style()){
styleid=1;
bordercolor="#999999";
borderstyle="solid";
borderwidth=1;
fontfamily="arial, tahoma";
fontsize="100%";
fontstyle="normal";
fontweight="normal";
image="images/menu/18_blank.gif";
imagepadding=5;
menubgimage="images/menu/backoff_dropdown.gif";
offbgcolor="transparent";
offcolor="#000000";
onbgcolor="#FEFAD2";
onborder="1px solid #999999";
oncolor="#000000";
onsubimage="images/menu/on_13x13_greyboxed.gif";
outfilter="randomdissolve(duration=0.2)";
overfilter="Fade(duration=0.1);Alpha(opacity=95);Shadow(color=#777777', Direction=135, Strength=3)";
padding=3;
pagebgcolor="#CFE2D1";
pagebgimage="images/menu/on_downboxed.gif";
pagecolor="#000066";
pageimage="images/menu/db_red.gif";
separatoralign="right";
separatorcolor="#999999";
separatorpadding=1;
separatorwidth="85%";
separatorsize=1
subimage="images/menu/black_13x13_greyboxed.gif";
menubgcolor="#F5F5F5";
}

[/code]

[Ruth]

Hi,

Use bgimage instead of menubgimage. That seems to work. It also means if you wanted to you could create the same image a different color for an overbgimage....

You're not using a menubgimage in the horizontal are you?

Ruth

[SOCO]

Wonderful Ruth! Using bgimage brought my gif image back to the sub-menus. However, the sub-menu separator is still transparent. If I set the separatorsize=0 it obviously goes away and looks fine, but it would be nice to have the separators. Any ideas for this? I have updated my test page from above.

To answer you question, I used bgimage in the horizontal menu and hadn't noticed that the two were different.

Jason

[Ruth]

Hi,

It's because you left that menubgimage="backoff_dropdown.gif"; in there. Remove that and the separators show up.

Ruth

[SOCO]

Thank you! That did the trick.