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:33
Lot of "newb" questions
Poster: AlexV
Dated: Saturday June 23 2007 - 13:29:13 BST
Hello !
I have some questions about my menu here:
http://www.wolfcast.com/menuc/milonic
1) How do I remove the drop shadow of the menu (an sub-menu boxes)?
2) How do I place the background image to "bottom" and repeay-x only?
3) How do I add a 1px border around the selection's border? See http://www.wolfcast.com/menuc for what I want...
4) Why my community button is so small... With itemwidth="100%" It sould have an even width with the others...
5) If I specify separatorheight="80%", how do I center vertically the separator... separatoralign="center" is not working...
Thanks a lot !
Poster: Ruth
Dated: Saturday June 23 2007 - 16:07:06 BST
Hi Alex,
Just to let you know I'm working on this so your menu will be the same as the other. It will be a bit later today before I can post all you need.
Ruth
Poster: Ruth
Dated: Saturday June 23 2007 - 18:45:40 BST
Hi Alex,
I have a couple of questions so I can make sure everything is as it should be.
1. Is there a reason the menu is set at 850px since that causes a scroll bar along the bottom of the screen?
2. Is your site going to be centered? The reason is, if it is centered then I'll be using screenposition="center"; and eliminating the left=10; from the menu. With that the menu will always stay centered even at higher resolutions.
Ruth
Poster: AlexV
Dated: Saturday June 23 2007 - 20:05:50 BST
The webdesign have a width of 850. The menu must be exactly 850px width otherwise it will look odd.
The design is centered also. So the menu must be centered at all times...
Thanks !
Poster: Ruth
Dated: Saturday June 23 2007 - 20:43:56 BST
Hi,
OK, to use a bgimage and set it to repeat-x you need to use css. Using css to put in a bgimage puts the image into each item. It is equivalent to the bgimage=; parameter of the menu, but controllable for other css properties like repeat, position etc.
In your css create the following classes. The second one is to fix the problem with the last item. I am reporting that issue and Milonic will address it. They are pretty quick at fixes, but this is a workaround for now that will fix the problem until they get to it.
Add to your css codes
Code:
.menubg{
background: transparent url(MenuGradient.gif) repeat-x top left;text-decoration:none
}
.commu{background: transparent url(MenuGradient.gif) repeat-x top left;text-indent:20px;text-decoration:none}
background: transparent url(MenuGradient.gif) repeat-x top left;text-decoration:none
}
.commu{background: transparent url(MenuGradient.gif) repeat-x top left;text-indent:20px;text-decoration:none}
This is your styles now
Code:
with(menuStyleMain=new mm_style()){
align="center";
bordercolor="rgb(71,150,183)";
borderstyle="solid";
borderwidth=1;
fontfamily="\"Segoe UI\", Tahoma, Geneva, Verdana, Arial, Helvetica";
fontsize=12;
fontstyle="normal";
fontweight="bold";
headerbgcolor="#ffffff";
headercolor="#000000";
//offbgcolor="transparent";
offcolor="#09587d";
//onbgcolor="transparent";
oncolor="#000099";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color=#777777', Direction=135, Strength=3)";
//padding=4;
pagebgcolor="#82B6D7";
pagecolor="black";
separatorcolor="rgb(71,150,183)";
separatorwidth=1;
separatorheight=16;
separatorpadding="2 0 2 0";
//subimage="arrow.gif";
//subimagepadding=2;
menubgimage="MenuGradient.gif";
//menubgcolor="";
offclass="menubg";
onclass="menubg";
}
with(menuStyleSub=new mm_style()){
bordercolor="rgb(71,150,183)";
borderstyle="solid";
borderwidth=1;
fontsize="12";
offbgcolor="rgb(248,251,252)";
offcolor="rgb(9,88,125)";
onborder="1px solid rgb(71,150,183)";
onbgcolor="rgb(101,196,233)";
oncolor="#FFFFFF";
outfilter="randomdissolve(duration=0.3)";
overfilter="Blinds(bands=1, direction='Down', duration=0.5);Alpha(opacity=90);Shadow(color=#777777', Direction=135, Strength=3)";
padding=4;
}
align="center";
bordercolor="rgb(71,150,183)";
borderstyle="solid";
borderwidth=1;
fontfamily="\"Segoe UI\", Tahoma, Geneva, Verdana, Arial, Helvetica";
fontsize=12;
fontstyle="normal";
fontweight="bold";
headerbgcolor="#ffffff";
headercolor="#000000";
//offbgcolor="transparent";
offcolor="#09587d";
//onbgcolor="transparent";
oncolor="#000099";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color=#777777', Direction=135, Strength=3)";
//padding=4;
pagebgcolor="#82B6D7";
pagecolor="black";
separatorcolor="rgb(71,150,183)";
separatorwidth=1;
separatorheight=16;
separatorpadding="2 0 2 0";
//subimage="arrow.gif";
//subimagepadding=2;
menubgimage="MenuGradient.gif";
//menubgcolor="";
offclass="menubg";
onclass="menubg";
}
with(menuStyleSub=new mm_style()){
bordercolor="rgb(71,150,183)";
borderstyle="solid";
borderwidth=1;
fontsize="12";
offbgcolor="rgb(248,251,252)";
offcolor="rgb(9,88,125)";
onborder="1px solid rgb(71,150,183)";
onbgcolor="rgb(101,196,233)";
oncolor="#FFFFFF";
outfilter="randomdissolve(duration=0.3)";
overfilter="Blinds(bands=1, direction='Down', duration=0.5);Alpha(opacity=90);Shadow(color=#777777', Direction=135, Strength=3)";
padding=4;
}
The change in the overfilter for the submenu will make it open like the other one, but only in IE. The filters and transitions are proprietary to IE. There is no way to get that in the other browsers. If you want them all the same, just put the fade back in the submenu style section.
Finally, this is your main menu. You will need to create a transparent image 1px high and 20px wide, this is needed in that community item to fix the problem until Milonic does a fix to the program
Main menu code
Code:
with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
menuwidth=850;
menuheight=20;
itemwidth="100%";
itemheight=20;
orientation="horizontal";
style=menuStyleMain;
top=10;
left=10;
screenposition="center";
aI("showmenu=Home;text=Home;url=/;");
aI("showmenu=Products;text=Products;");
aI("showmenu=Services;text=Services;");
aI("text=Download;url=/download/;");
aI("text=Order;url=catalog.php;");
aI("showmenu=Support;text=Support;");
aI("showmenu=Company;text=Company;");
aI("text=Community;offclass=commu;onclass=commu;image=blank.gif;imagewidth=20;imageposition=right;url=/forum/;");
}
alwaysvisible=1;
menuwidth=850;
menuheight=20;
itemwidth="100%";
itemheight=20;
orientation="horizontal";
style=menuStyleMain;
top=10;
left=10;
screenposition="center";
aI("showmenu=Home;text=Home;url=/;");
aI("showmenu=Products;text=Products;");
aI("showmenu=Services;text=Services;");
aI("text=Download;url=/download/;");
aI("text=Order;url=catalog.php;");
aI("showmenu=Support;text=Support;");
aI("showmenu=Company;text=Company;");
aI("text=Community;offclass=commu;onclass=commu;image=blank.gif;imagewidth=20;imageposition=right;url=/forum/;");
}
What fixed the Community item problem was to set text-indent to 10px in the css class .commu and to add the 20px wide transparent image to the item and position it at the right side. As soon as the problem of the item being squished small is fixed you can just eliminate the offclass=commu;onclass=commu and all the image coding in the item.
Hope this helps. If you need anything else, just post
Ruth
Poster: AlexV
Dated: Sunday June 24 2007 - 14:00:25 BST
And how I do a menu selection like my old menu? (see http://www.wolfcast.com/menuc)
And is this a known bug that the main menu items are not shown on Opera Beta Windows?
Poster: Ruth
Dated: Sunday June 24 2007 - 17:34:49 BST
Hi,
I don't know what you want with your old menu. That is not a milonic menu so I wouldn't have any idea how it works. This is the Milonic menu site, we wouldn't be providing support for someone else's menu. When you mouseover the old menu a submenu drops down. When you mouseover the Milonic menu, a submenu drops down. I don't know what you want
What is it you are talking about as to Opera. Milonic doesn't have any kind of bug in Opera to my knowledge. At least there have been no posts here about anything wrong and I'd think if the main menu were disappearing in a browser we'd have a lot of posts with questions on it.
What I provided you in the code section was a complete data file and the css required so that you can set up the Milonic menu as you wanted it. If that is not working, please give me a link to the page where you have it and I'll take a look. It worked fine on my page.
Ruth
Poster: AlexV
Dated: Sunday June 24 2007 - 19:43:35 BST
I mean in my old menu, when I select a menu, there is a selection blue box. This box hve a blue border and around this blue border, theres a white bors. This white border is missing on my milonic version.
I will post a screen shot of the Opera "bug"...
Poster: Ruth
Dated: Sunday June 24 2007 - 21:17:29 BST
Hi,
Sorry, I forgot to tell you to put margin=4; in all the submenus. For example
Code:
with(milonic=new menuname("Products")){
style=menuStyleSub;
margin=4;
style=menuStyleSub;
margin=4;
That will give you the same as the other menu.
Ruth
Poster: AlexV
Dated: Monday June 25 2007 - 14:11:36 BST
One last thing
How do I align the left border of the "poping" menus with the separators ?
Thanks a lot !
Poster: Ruth
Dated: Monday June 25 2007 - 16:11:26 BST
Hi,
In each submenu, except the first one Home, add left="offset=-1";
Code:
with(milonic=new menuname("Company")){
style=menuStyleSub;
margin=4;
left="offset=-1";
style=menuStyleSub;
margin=4;
left="offset=-1";
Also, below my name are some links to various properties. Most have explanations of what they are. And this post
http://www.milonic.com/forum/viewtopic. ... 2089#42089
has explanations of all I could figure out.
Also, in the menu samples listed on the main site menu there is a section on Functionality Samples, so you can see how to do things like opening new windows from a menu, setting offsets, and such.
Ruth