[resolved] Double image and menu problems...

Taken From The Forum:
Forum Topic:
Last Updated: Saturday July 14 2012 - 06:07:17

[resolved] Double image and menu problems...

Poster: dmacman
Dated: Monday January 23 2006 - 13:25:15 GMT

Hi All,

I temporarly gave up on the PHP versions of the menus, until Andy, gets a chance to re-write the code that will support tables, and now I am trying to get the menus to work and have a few issues.

Here is the link the page.

http://www.itcmmailcenter.com/index3.php

1) the images repeat, sorry, I still haven't figured out the code to write it from hand, and
when I 'resuse' my old code with the new links and graphics, it doesn't work.

2) I am getting multiple menus.

I appreciate the help,

Don

Poster: Ruth
Dated: Monday January 23 2006 - 13:54:18 GMT

Hi Don,

You've got the bgimage and the overbgimage and the image and overimage all the same button, and when you type text in the item the image shifts over to make room for the text. I removed the image and overimage. With just he bgimage and overbgimage everything shifts back into place as it should. Take the image from the menu_data file and remove the overimage from the items.

Code:

aI("bgimage=button1.gif;overbgimage=button1.gif;url=index.php;text=FTCM;
itemwidth=95;");

Ruth

Poster: dmacman
Dated: Monday January 23 2006 - 17:13:51 GMT

Hi Ruth,

Thanks, I am closer. I believe I made the changes you sugggested. I need to fix some spacing issues, and a slight double image instance.

Any ideas?

Am I close?

Thanks,

Don

Poster: Ruth
Dated: Monday January 23 2006 - 21:40:09 GMT

Hi,

Change the style you have in the head to add a second class for the submenus.

Code:

<STYLE type=text/css>BODY {
   MARGIN: 0px
}
.myclass {
  background-image: url(button1.gif);background-repeat:no-repeat;PADDING-TOP: 0px;PADDING-RIGHT: 5px; PADDING-BOTTOM: 2px; PADDING-LEFT: 9px; 
}
.subclass{ background-image:url(button2.gif); background-repeat:no-repeat;
} 
</STYLE>

Next, here is the menu_data.js file styles.

Code:

with(menuStyle=new mm_style()){
borderstyle="solid";
borderwidth=0;
bordercolor="#000000";
fontfamily="Verdana, Tahoma, Arial";
fontsize="10px";
fontstyle="normal";
imagepadding=2;
seperatorpadding=5;
itemheight=24;
itemwidth=95;
menuwidth=591;
headerbgcolor="#FFFFFF";
headercolor="#000000";
padding=3;
offcolor="#000000";
oncolor="#666666";
offbgcolor="";
onbgcolor="";
pagecolor="black";
offclass="myclass";
onclass="myclass";
valign="bottom";
overfilter="Fade(duration=0.2);Alpha(opacity=100);Shadow(color='#777777', Direction=135, Strength=5)";
outfilter="randomdissolve(duration=0.3)";
}
subStyle=new copyOf(menuStyle); 
subStyle.offclass="subclass"; 
subStyle.onclass="subclass"; 
subStyle.menubgcolor="";

Then make all the submenus like the following Production one. Part of the problem is the overflow="scroll"; in these menus.

Code:

with(milonic=new menuname("Production")){
style=subStyle;
itemwidth="99px";
itemheight="21px";
aI("text=Pwr of Choice;showmenu=The Power of Choice;");
aI("text=Ultimate Rsrce;showmenu=Ultimate Resource;");
aI("text=Yours &amp; Mine;showmenu=Yours/Mine;");
aI("text=The Poor;showmenu=Power of the Poor;");
aI("text=Copenhagen;showmenu=Copenhagen Consen.;");
}

Two final notes: you need to make the button2 have the white part transparent, that shows in the area of the sunset, so it looks like a white box with the bgimage on it; also if you want the submenus to not have space between the items you have to add the itemheight=21; into each aI string.

Hope this helps.

Ruth

Poster: dmacman
Dated: Tuesday January 24 2006 - 13:08:54 GMT

Excellent!! Of course!

Thanks Ruth, that helps a lot.

I will get this down sooner (hopefully) or later.

I did what you suggested and it worked great.

This is in the early testing stages, so I may change buttons, text, etc, but that gets me close.

I will try and play with the text positioning to center the text over the buttons, to make it more readable.

Thanks for the help,
Don

Poster: Ruth
Dated: Tuesday January 24 2006 - 14:14:24 GMT

Hi

Just add align="center"; to the menuStyle and all menus that use that style will have their text aligned center, since it is only the main menu, it would only be the main menu. Or you can add that to any menu and that particular menu would have the text aligned center.

Ruth

Poster: dmacman
Dated: Wednesday January 25 2006 - 11:15:50 GMT

Thank you, as always, you are the answer person!

It is very close to what I want, and I will play with it and finalize the buttons (I will make some that look the way I want them).

Consider this thread [resolved]!

Don

Industrial Strength JavaScript and DHTML Menus

[resolved] Double image and menu problems...