Industrial Strength JavaScript and DHTML Menus
About Us
Testimonials
Contact Us
Our Distinguished Clients
Investing in Non-Profits
Where Are We
Privacy Policy
Software Licensing Agreement
DHTML JavaScript Menu
Product Information
Page Integration
Quick Reference Guides
Embedding Into a Table or DIV
Purchase
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:32
how to put border around whole menu but the top? [SOLVED]
Poster: nwilcox
Dated: Monday June 25 2007 - 23:03:54 BST
hello everyone,
Is there a way to put a border on three sides of a sub-menu (excluding the top)?
Thanks!
Poster: Ruth
Dated: Tuesday June 26 2007 - 3:02:50 BST
Hi,
Yes, but not in the menu properties, you have to do it with css class, now this would mean that you really aren't putting it around the 'menu' but around the items, so if it's horizontal, you'd create a class with border-top:0px solid red;border-right:1px solid red; and so on. This would put borders on the right, left, and bottom of each item. Now, the problem here is you cannot use separators since they are in the menu container and will show spaces between items. And, if it's a vertical menu, then you'd need different classes, 2 classes, 1 for all but the bottom items, which only had left and right borders, and 1 for the bottom item that had left, right and bottom. Now, if you give me the site, I might be able to figure something out using divides and a menubgimage
Hope that made sense
Ruth
Poster: nwilcox
Dated: Tuesday June 26 2007 - 18:01:38 BST
wow that sounds very complex. There is no simple way to place a border on 3 out of the 4 sides?
If I have padding in any of the menu items that solution isn't going to work is it? as the borders won't show up where they need to???
http://clients2.serverside.net/asda/
first sub menu under first menu button would not have a top border as you can see here I need the top border to be removed.
thanks!
Poster: Ruth
Dated: Tuesday June 26 2007 - 20:55:56 BST
Hi,
You can't do it with the border property, but I'll play around and see if I can figure another way. It may take some time but I'll post back.
Ruth
Poster: Ruth
Dated: Wednesday June 27 2007 - 5:56:48 BST
Hi,
Well, it was much easier than I thought, given you already had done most of the work with your menuStyleSubAlt and the publications submenu
OK, use that style and all the other stuff, rawcss and such that you have in that publications submenu in all submenus that you want to have a right, bottom, left border and add this class to your css stylesheet and call the class in the last item of those submenus.
Code:
.mmbord{border-bottom:1px solid #CDCDCD;text-decoration:none;font-size:10px;padding-left:5px;padding-top:0;padding-bottom:0;padding-right:15px;}
So, your publications and our about submenus would be
Code:
with(milonic=new menuname("publications")){
style=menuStyleSubAlt;
itemwidth="183px";
top="offset=0";
left="offset=-1";
rawcss="border-right:1px solid #CDCDCD;border-left:1px solid #CDCDCD;"
aI("itemheight=15px;image=menu_spacer.gif;type=header;");
aI("text=The links;url=index.aspx;showmenu=testing;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;offclass=mmbord;onclass=mmbord;");
}
with(milonic=new menuname("aboutasda")){
style=menuStyleSubAlt;
itemwidth="183px";
top="offset=0";
rawcss="border-right:1px solid #CDCDCD;border-left:1px solid #CDCDCD;"
aI("itemheight=15px;image=menu_spacer.gif;type=header;");
aI("text=The links;url=index.aspx;showmenu=testing;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;offclass=mmbord;onclass=mmbord;");
}
style=menuStyleSubAlt;
itemwidth="183px";
top="offset=0";
left="offset=-1";
rawcss="border-right:1px solid #CDCDCD;border-left:1px solid #CDCDCD;"
aI("itemheight=15px;image=menu_spacer.gif;type=header;");
aI("text=The links;url=index.aspx;showmenu=testing;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;offclass=mmbord;onclass=mmbord;");
}
with(milonic=new menuname("aboutasda")){
style=menuStyleSubAlt;
itemwidth="183px";
top="offset=0";
rawcss="border-right:1px solid #CDCDCD;border-left:1px solid #CDCDCD;"
aI("itemheight=15px;image=menu_spacer.gif;type=header;");
aI("text=The links;url=index.aspx;showmenu=testing;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;");
aI("text=The links;url=index.aspx;offclass=mmbord;onclass=mmbord;");
}
I tested in IE5.5, 6, FF 1.02, 1.5, Safari 4windows beta 3.0
Ruth
