Fixed Width Menu

Having problems with DHTML Menu? There is usually somebody here who knows the answer.
Post Reply
tepidarium
Mega User
Mega User
Posts: 169
Joined: Sun Oct 05, 2003 4:21 am

Fixed Width Menu

Post by tepidarium »

Hi all,

I am trying to create a 750px fixed width menu. I tried using the "itemwidth" parameter in the menu, but when I use this parameter it makes each menu item 750px...instead of the whole menu as 750 px. This parameter seems to only pertain to menu items, not to whole menus themselves. Am I wrong?

Thanks all!
User avatar
Maz
Milonic God
Milonic God
Posts: 1717
Joined: Fri Jun 06, 2003 11:39 pm
Location: San Francisco
Contact:

Post by Maz »

You can try overallwidth, not sure if it works though.

Regards
maz
User avatar
kevin3442
Milonic God
Milonic God
Posts: 2460
Joined: Sat Sep 07, 2002 12:09 am
Location: Lincoln, NE
Contact:

Post by kevin3442 »

You are not wrong... the itemwidth property pertains to items.

Kevin
tepidarium
Mega User
Mega User
Posts: 169
Joined: Sun Oct 05, 2003 4:21 am

Post by tepidarium »

I have been consulting Menu Properties at:
http://milonic.com/menuproperties.php

It lists itemwidth...it doesn't list overallwidth but I'm going to try that. Thanks!
User avatar
kevin3442
Milonic God
Milonic God
Posts: 2460
Joined: Sat Sep 07, 2002 12:09 am
Location: Lincoln, NE
Contact:

Post by kevin3442 »

Hi all,

A few comments about overall widths:

(1) It is perhaps a little misleading that the definition for the itemwidth menu property states,
itemwidth is an optional property that will fix the width of a menu based on declared pixel values. If this value is ommited, the menu will calculate the best width to use.
Despite the name of the property itself, that definition does make it seem like it directly sets the "width of a menu..." even though its effect on overall width is indirect (at least for horizontal menus). Probably should say something like, "...that will set the width of each item in the menu..." since it really affects individual items rather than the menu as a whole. (Also -- picky, picky -- "ommited" should be "omitted" in the current definition). One might also add a note that, since every item in a vertical menu is the same width, setting the itemwidth in a vertical menu actually does have the indirect effect of setting the overall menu width.

(2) The definition for the itemwidth menu item property (i.e., setting it per item) states,
"changes the natural item for this menu item. Should only be used in horizontal menus."
Might want to change it to, "changes the natural width for this menu item...."

(3) overallwidth was a property that was listed quite some time ago, but it wasn't supported yet. It actually disappeared from the properties list a while back. I would take its disappearance to mean that there are no longer plans to support this option, but then again... what do I know? It may well find its way back some day. For now at least, it doesn't have any effect.

(4) To have a horizontal menu that is a specific width, you could:

(a) Set an itemwidth that is large enough to hold the widest main menu item.

(b) Multiply the number of menu items by the itemwidth to get the "real total width." We'll assume that this "real total width" is less than the width you want, which we'll call the "desired total width".

(c) Subtract the "real total width" from your "desired total width"; call that difference the "width_padding".

(d) Add a fake menu item to the end of your main menu like so:

Code: Select all

aI("text= ;itemwidth=width_padding;onbgcolor=#offbgcolor;");
In the line of code above, (i) set the itemwidth to the numeric value you calculated for your "width_padding" in 4c above, and (ii) set the onbgcolor to the color code used for offbgcolor in this menu's style definitions. This should add a "dummy" menu item at the end that does nothing but take up the extra space needed to extend your menu as far as you like.

If you use separators in the menu, then there will be a separator between the last real menu item and the "dummy" item at the end. If that bugs you, then you can get rid of it in at least three different ways: (i) set separatorheight=0 in the last real menu item (the one before the dummy item), or (ii) set separatorsize=0 in the last real menu item, or (iii) set the last real menu item's separatorcolor to the menu style's offbgcolor.

Hope that made sense, and hope it may help some of you.

Kevin
Post Reply