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:57
RC20 - Missing raised border on the vertical edges of menus
Poster: joel.miller __at__ henderson.com
Dated: Monday November 10 2003 - 17:30:32 GMT
Hi,
I've just upgraded to RC20 and my (vertical left nav) menus are now missing the vertical edges of the raised '3D' style border. The separator still appears to be 3D. Any idea why this might be?
Here's my style...
Code:
with(menuStyle=new mm_style()){
onbgcolor="";
oncolor="#E93C3A";
offbgcolor="";
offcolor="#004B8C";
bordercolor="#7CABD1";
borderstyle="raised";
borderwidth="2";
separatorcolor="";
separatorsize="2"
padding="3";
fontsize="10px";
fontstyle="normal";
fontweight="bold";
fontfamily="Verdana, Tahoma, Arial";
high3dcolor="#ffffff";
low3dcolor="#7caad0";
menuwidth="156px";
subimage="/assets/images/nav/arrows/arrow_red.gif";
subimagepadding="2";
pagecolor="e93c3a";
pagebgcolor="";
}
onbgcolor="";
oncolor="#E93C3A";
offbgcolor="";
offcolor="#004B8C";
bordercolor="#7CABD1";
borderstyle="raised";
borderwidth="2";
separatorcolor="";
separatorsize="2"
padding="3";
fontsize="10px";
fontstyle="normal";
fontweight="bold";
fontfamily="Verdana, Tahoma, Arial";
high3dcolor="#ffffff";
low3dcolor="#7caad0";
menuwidth="156px";
subimage="/assets/images/nav/arrows/arrow_red.gif";
subimagepadding="2";
pagecolor="e93c3a";
pagebgcolor="";
}
Thanks!
Poster: joel.miller __at__ henderson.com
Dated: Tuesday November 11 2003 - 13:51:30 GMT
Further to my problem, I notice the Win 98 style 3D sample also now seems to be displaying the same visual error...
http://milonic.com/menusample.php?sampleid=13
Thanks,
Joel
Poster: kevin3442
Dated: Tuesday November 11 2003 - 16:28:41 GMT
Same here, using Release Candidate 21.0 Built: Monday November 10 2003 - 19:14.
Kevin
Poster: John
Dated: Tuesday November 11 2003 - 17:22:05 GMT
RC22 is current. Not sure what he did, but you might want to give it a try.
Poster: joel.miller __at__ henderson.com
Dated: Tuesday November 11 2003 - 17:30:16 GMT
Tried RC22... same problem.
Poster: Andy
Dated: Wednesday November 12 2003 - 12:12:43 GMT
RC23 should have a fix for the border.
Cheers
Andy
Poster: kevin3442
Dated: Wednesday November 12 2003 - 16:34:49 GMT
Hmmm... it did change. But it looks as if high and low are reversed for the borders, but not for the separators. Makes for an interesting effect though, and raises the point in my mind that it would allow for more flexible 3D effects if one could specify high and low for borders and separators separately. Maybe a "down the road"enhancement?...
Cheers,
Kevin
Poster: joel.miller __at__ henderson.com
Dated: Thursday November 13 2003 - 11:10:32 GMT
Hi,
Same here, the borders are reversed now, and the seperator appears to be raised.
Cheers,
Joel
Poster: Andy
Dated: Thursday November 13 2003 - 18:48:32 GMT
I think the system is correct.
If you have a raised separator bar you should also have a raised menu?
Let me know if you think this is wrong.
Anyway, I've now added a new property called swap3d - This can be set to either true or 1 to swap the border of the menu around. The separators remain as normal but if you need these changing just swap the actual colors around in the style.
Netscape 4 will require you use a borderstyle of either "raised" or "inset" depending on how you want. This is until I can figure a better way of doing it.
RC24 should have all the code included now.
Cheers
Andy
Poster: kevin3442
Dated: Thursday November 13 2003 - 21:46:05 GMT
Andy wrote:
I think the system is correct. If you have a raised separator bar you should also have a raised menu? Let me know if you think this is wrong.
Depends on what you mean by "raised menu" I think there must be something wrong, because the appearance from RC19 to RC20-24 is changed, even though menu_data.js remains unchanged. Consider the following two caps, both using the same menu_data.js file, with highgh3dcolor="#E0E1FF" (which looks like this); and low3dcolor="#70718F" (which looks like this);
RC19
RC24
Note that the separator has not changed in appearance, but the borders have; the high3dcolor and low3dcolor are applied opposite from the way they used to be, both in version 3 and in version 5, up through RC19.
In my way of thinking, the "raised menu" is depicted in the RC19 example above, with the menu items themselves appearing raised above the edges, and the separators therefore appearing as little indentations between raised menu items. This would be consistent with the definitions of high3dcolor and low3dcolor given in the quick refs:
high3dcolor:
Quote:
...Rather like the way in which Windows 98 menus appear. The High Color denotes the shadow color as a direct hit from the light source.
i.e., assuming the light source is upper left, as in Windows 98, the high3dcolor would apply to the top and left border, directly hit by the light.
low3dcolor:
Quote:
...The Low Color denotes the shadow color as a shadow, not a direct hit from the light source.
i.e., low3dcolor would apply to the right and bottom borders, not directly hit by the light source.
In the RC24 example above, the "rules" have reversed when applied to the borders; high3dcolor applying to the right and bottom and low3dcolor applying to the top and left. As a result, the outside edges around each item appear to be raised but the separators are still indented (actually looks pretty good, but its inconsistent with past behavior).
If you went for a similar effect prior to RC20 (i.e., by swapping high3dcolor and low3dcolor), you'd have raised edges and raised separators, like so:
RC19 - swapped
There is currently no way to achieve this effect in version 5 (RC20+), which is a little bit of a bummer because (1) it's kind of cool looking and (2) you could do it in version 3.
Final note: Setting swap3d=1 in menu_data.js using RC24 results in an appearance just like the RC19 example above. But it seems contrary to me to have to add a property to swap the colors to get them to look the way they used to look. Wouldn't it make more sense to swap the colors to achieve the swapped look evident in the RC24 example above?
In any case, the swap3d property is a very cool addition. Thank you very much!
Kevin