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:35
I will Pay for your custom menu creation services
Poster: Kelly McNeill
Dated: Thursday May 3 2007 - 18:21:26 BST
Hello,
if anyone here is interested in making some extra money... I am willing to pay a service fee to anyone interested in helping me create a custom menu.
I tried, and I'm finding that this stuff is a bit over my head.
The User Guide (http://www.milonic.com/beginner.php) mentions the allowance of background images which is what I would like to do, though it focuses primarily on background images that repeat for each navigation category. I would like to have a custom image for each one.
Here is a visual representation of what I'm trying to do:
I would like to make this menu:
http://www.platypuscreations.com/xeriom/index.htm
look like this menu:
http://www.platypuscreations.com/xeriom/index.html
(The sub menus can remain html text (as I tried to do in the attached "menu_data.js" file) but I would like the main navbar to have unique visual characteristics for each category)
Please send a price quote to me at < kelly at platypus creations dot com >
Poster: Ruth
Dated: Thursday May 3 2007 - 19:28:46 BST
Hi Kelly,
Since you have the images, it is really simple to make what you want. I'll post the file here, but figured I'd explain so you would be able to understand what was done.
1. I copied and pasted the menuStyle so there were two of them and then changed the name of the second to subStyle and applied it in the submenus.
2. I changed the original menuStyle which you'll see in the posted data file.
3. I added buildAfterLoad=true; to the top of the data file
4. I changed the top, left, overflow=scroll on the main menu to just have position="relative"; and added menuwidth=100; itemwidth=100; to it.
5. I changed the table on the page since it only needs one cell now, the one to hold the menu.
This is the new menu_data.js file
Code:
fixMozillaZIndex=true; //Fixes Z-Index problem with Mozilla browsers but causes odd scrolling problem, toggle to see if it helps
_menuCloseDelay=500;
_menuOpenDelay=150;
_subOffsetTop=2;
_subOffsetLeft=-2;
buildAfterLoad=true;
with(menuStyle=new mm_style()){
//bordercolor="#296488";
//borderstyle="solid";
//borderwidth=0;
//fontfamily="Verdana, Tahoma, Arial";
//fontsize="60%";
//fontstyle="normal";
//headerbgcolor="#ffffff";
//headercolor="#000000";
offbgcolor="transparent";
offcolor="#515151";
onbgcolor="transparent";
oncolor="#ffffff";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color=#777777', Direction=135, Strength=5)";
padding=0;
//pagebgcolor="#82B6D7";
//pagecolor="black";
//separatorcolor="#2D729D";
//separatorsize=1;
//subimage="arrow.gif";
//subimagepadding=2;
}
with(subStyle=new mm_style()){
bordercolor="#296488";
borderstyle="solid";
borderwidth=1;
fontfamily="Verdana, Tahoma, Arial";
fontsize="60%";
fontstyle="normal";
headerbgcolor="#ffffff";
headercolor="#000000";
offbgcolor="#DCE9F0";
offcolor="#515151";
onbgcolor="#4F8EB6";
oncolor="#ffffff";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color=#777777', Direction=135, Strength=5)";
padding=5;
pagebgcolor="#82B6D7";
pagecolor="black";
separatorcolor="#2D729D";
separatorsize=1;
subimage="http://www.milonic.com/menuimages/arrow.gif";
subimagepadding=2;
}
with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
style=menuStyle;
position="relative";
menuwidth=100;
itemwidth=100;
aI("showmenu=aboutxeriom;image=about-off.gif;overimage=about-on.gif;pageimage=about-on.gif;");
aI("showmenu=services;image=services-off.gif;overimage=services-on.gif;");
aI("url=inthenews;image=inthnews-off.gif;overimage=inthnews-on.gif;");
aI("url=clients;image=clients-off.gif;overimage=clients-on.gif;");
aI("url=contactus;image=contact-off.gif;overimage=contact-on.gif;");
aI("url=contactus;image=corevalues-off.gif;overimage=corevalues-on.gif;");
aI("url=careers;image=careers-off.gif;overimage=careers-on.gif;");
}
with(milonic=new menuname("aboutxeriom")){
overflow="scroll";
style=subStyle;
aI("text=About Xeriom;url=about.htm");
aI("text=Executive Team;url=about/executiveteam/;")
aI("text=Award;url=about/award/;")
aI("text=Partners and Affiliations;url=about/partnersandaffiliations/;")
}
with(milonic=new menuname("services")){
style=subStyle;
aI("text=Services;url=services");
aI("text=Infrastructure Services;url=services/infrastructureservices/;");
aI("text=Managed Service;url=services/managedservice/;");
aI("text=Project Management;url=services/projectmanagement/;");
aI("text=Resource Delivery;url=services/resourcedelivery/;");
}
drawMenus();
_menuCloseDelay=500;
_menuOpenDelay=150;
_subOffsetTop=2;
_subOffsetLeft=-2;
buildAfterLoad=true;
with(menuStyle=new mm_style()){
//bordercolor="#296488";
//borderstyle="solid";
//borderwidth=0;
//fontfamily="Verdana, Tahoma, Arial";
//fontsize="60%";
//fontstyle="normal";
//headerbgcolor="#ffffff";
//headercolor="#000000";
offbgcolor="transparent";
offcolor="#515151";
onbgcolor="transparent";
oncolor="#ffffff";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color=#777777', Direction=135, Strength=5)";
padding=0;
//pagebgcolor="#82B6D7";
//pagecolor="black";
//separatorcolor="#2D729D";
//separatorsize=1;
//subimage="arrow.gif";
//subimagepadding=2;
}
with(subStyle=new mm_style()){
bordercolor="#296488";
borderstyle="solid";
borderwidth=1;
fontfamily="Verdana, Tahoma, Arial";
fontsize="60%";
fontstyle="normal";
headerbgcolor="#ffffff";
headercolor="#000000";
offbgcolor="#DCE9F0";
offcolor="#515151";
onbgcolor="#4F8EB6";
oncolor="#ffffff";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color=#777777', Direction=135, Strength=5)";
padding=5;
pagebgcolor="#82B6D7";
pagecolor="black";
separatorcolor="#2D729D";
separatorsize=1;
subimage="http://www.milonic.com/menuimages/arrow.gif";
subimagepadding=2;
}
with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
style=menuStyle;
position="relative";
menuwidth=100;
itemwidth=100;
aI("showmenu=aboutxeriom;image=about-off.gif;overimage=about-on.gif;pageimage=about-on.gif;");
aI("showmenu=services;image=services-off.gif;overimage=services-on.gif;");
aI("url=inthenews;image=inthnews-off.gif;overimage=inthnews-on.gif;");
aI("url=clients;image=clients-off.gif;overimage=clients-on.gif;");
aI("url=contactus;image=contact-off.gif;overimage=contact-on.gif;");
aI("url=contactus;image=corevalues-off.gif;overimage=corevalues-on.gif;");
aI("url=careers;image=careers-off.gif;overimage=careers-on.gif;");
}
with(milonic=new menuname("aboutxeriom")){
overflow="scroll";
style=subStyle;
aI("text=About Xeriom;url=about.htm");
aI("text=Executive Team;url=about/executiveteam/;")
aI("text=Award;url=about/award/;")
aI("text=Partners and Affiliations;url=about/partnersandaffiliations/;")
}
with(milonic=new menuname("services")){
style=subStyle;
aI("text=Services;url=services");
aI("text=Infrastructure Services;url=services/infrastructureservices/;");
aI("text=Managed Service;url=services/managedservice/;");
aI("text=Project Management;url=services/projectmanagement/;");
aI("text=Resource Delivery;url=services/resourcedelivery/;");
}
drawMenus();
And this is the new table, it's in the same place as the existing one.
Code:
<DIV align=left>
<TABLE cellSpacing=0 cellPadding=0 width=100 height=296 border=0>
<TBODY>
<TR>
<TD width=100><script type="text/javascript" src="milonic_src.js"></script>
<script type="text/javascript" src="mmenudom.js"></script>
<script type="text/javascript" src="menu_data.js"></script></TD></TR>
</TBODY>
</TABLE></DIV>
<TABLE cellSpacing=0 cellPadding=0 width=100 height=296 border=0>
<TBODY>
<TR>
<TD width=100><script type="text/javascript" src="milonic_src.js"></script>
<script type="text/javascript" src="mmenudom.js"></script>
<script type="text/javascript" src="menu_data.js"></script></TD></TR>
</TBODY>
</TABLE></DIV>
That should put the menu in the same place and make it look exactly the same as it does now on that page.
If you don't need it in a table, then remove the buildAfterLoad=true; at the top of the data file, remove position="relative"; from the main menu and add back the top= and left= This is if you want to position it absolutely rather than in a table cell or div. And, move the calls for the files up to the first thing after the body tag.
Hope this helps
Ruth
Poster: Kelly McNeill
Dated: Thursday May 3 2007 - 19:32:10 BST
Thanks Ruth!
Send me a paypal invoice please.
Works great except for one small glitch
Poster: Kelly McNeill
Dated: Thursday May 3 2007 - 21:27:52 BST
Ruth,
thanks so much for your help. Perhaps you (or someone else) could help me with this last little bit.
Everything displays fine except for the "Services" navbar category. It's rendering the same contents as the "About Xeriom" navbar category
http://www.platypuscreations.com/xeriom/
here is the menu_data.js file:
Code:
fixMozillaZIndex=true; //Fixes Z-Index problem with Mozilla browsers but causes odd scrolling problem, toggle to see if it helps
_menuCloseDelay=500;
_menuOpenDelay=150;
_subOffsetTop=2;
_subOffsetLeft=-2;
buildAfterLoad=true;
with(menuStyle=new mm_style()){
//bordercolor="#FF843F";
//borderstyle="solid";
//borderwidth=0;
//fontfamily="Verdana, Tahoma, Arial";
//fontsize="60%";
//fontstyle="normal";
//headerbgcolor="#ffffff";
//headercolor="#000000";
offbgcolor="transparent";
offcolor="#515151";
onbgcolor="transparent";
oncolor="#ffffff";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color=#777777', Direction=135, Strength=5)";
padding=0;
//pagebgcolor="#82B6D7";
//pagecolor="black";
//separatorcolor="#2D729D";
//separatorsize=1;
//subimage="arrow.gif";
//subimagepadding=2;
}
with(subStyle=new mm_style()){
bordercolor="#FF843F";
borderstyle="solid";
borderwidth=1;
fontfamily="Verdana, Tahoma, Arial";
fontsize="60%";
fontstyle="normal";
headerbgcolor="#ffffff";
headercolor="#000000";
offbgcolor="#DCE9F0";
offcolor="#515151";
onbgcolor="#4F8EB6";
oncolor="#ffffff";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color=#777777', Direction=135, Strength=5)";
padding=5;
pagebgcolor="#82B6D7";
pagecolor="black";
separatorcolor="#2D729D";
separatorsize=1;
subimage="http://www.milonic.com/menuimages/arrow.gif";
subimagepadding=2;
}
with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
style=menuStyle;
position="relative";
menuwidth=100;
itemwidth=100;
aI("showmenu=services;image=images/navbar/about-off.gif;overimage=images/navbar/about-on.gif;");
aI("showmenu=services;image=images/navbar/services-off.gif;overimage=images/navbar/services-on.gif;");
aI("url=inthenews;image=images/navbar/inthnews-off.gif;overimage=images/navbar/inthnews-on.gif;");
aI("url=clients;image=images/navbar/clients-off.gif;overimage=images/navbar/clients-on.gif;");
aI("url=contactus;image=images/navbar/contact-off.gif;overimage=images/navbar/contact-on.gif;");
aI("url=careers;image=images/navbar/careers-off.gif;overimage=images/navbar/careers-on.gif;");
}
with(milonic=new menuname("aboutxeriom")){
overflow="scroll";
style=subStyle;
aI("text=About Xeriom;url=about.htm");
aI("text=Executive Team;url=about/executiveteam/;")
aI("text=Award;url=about/award/;")
aI("text=Partners and Affiliations;url=about/partnersandaffiliations/;")
}
with(milonic=new menuname("services")){
overflow="scroll";
style=subStyle;
aI("text=Services;url=services");
aI("text=Infrastructure Services;url=services/infrastructureservices/;");
aI("text=Managed Service;url=services/managedservice/;");
aI("text=Project Management;url=services/projectmanagement/;");
aI("text=Resource Delivery;url=services/resourcedelivery/;");
}
drawMenus();
_menuCloseDelay=500;
_menuOpenDelay=150;
_subOffsetTop=2;
_subOffsetLeft=-2;
buildAfterLoad=true;
with(menuStyle=new mm_style()){
//bordercolor="#FF843F";
//borderstyle="solid";
//borderwidth=0;
//fontfamily="Verdana, Tahoma, Arial";
//fontsize="60%";
//fontstyle="normal";
//headerbgcolor="#ffffff";
//headercolor="#000000";
offbgcolor="transparent";
offcolor="#515151";
onbgcolor="transparent";
oncolor="#ffffff";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color=#777777', Direction=135, Strength=5)";
padding=0;
//pagebgcolor="#82B6D7";
//pagecolor="black";
//separatorcolor="#2D729D";
//separatorsize=1;
//subimage="arrow.gif";
//subimagepadding=2;
}
with(subStyle=new mm_style()){
bordercolor="#FF843F";
borderstyle="solid";
borderwidth=1;
fontfamily="Verdana, Tahoma, Arial";
fontsize="60%";
fontstyle="normal";
headerbgcolor="#ffffff";
headercolor="#000000";
offbgcolor="#DCE9F0";
offcolor="#515151";
onbgcolor="#4F8EB6";
oncolor="#ffffff";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color=#777777', Direction=135, Strength=5)";
padding=5;
pagebgcolor="#82B6D7";
pagecolor="black";
separatorcolor="#2D729D";
separatorsize=1;
subimage="http://www.milonic.com/menuimages/arrow.gif";
subimagepadding=2;
}
with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
style=menuStyle;
position="relative";
menuwidth=100;
itemwidth=100;
aI("showmenu=services;image=images/navbar/about-off.gif;overimage=images/navbar/about-on.gif;");
aI("showmenu=services;image=images/navbar/services-off.gif;overimage=images/navbar/services-on.gif;");
aI("url=inthenews;image=images/navbar/inthnews-off.gif;overimage=images/navbar/inthnews-on.gif;");
aI("url=clients;image=images/navbar/clients-off.gif;overimage=images/navbar/clients-on.gif;");
aI("url=contactus;image=images/navbar/contact-off.gif;overimage=images/navbar/contact-on.gif;");
aI("url=careers;image=images/navbar/careers-off.gif;overimage=images/navbar/careers-on.gif;");
}
with(milonic=new menuname("aboutxeriom")){
overflow="scroll";
style=subStyle;
aI("text=About Xeriom;url=about.htm");
aI("text=Executive Team;url=about/executiveteam/;")
aI("text=Award;url=about/award/;")
aI("text=Partners and Affiliations;url=about/partnersandaffiliations/;")
}
with(milonic=new menuname("services")){
overflow="scroll";
style=subStyle;
aI("text=Services;url=services");
aI("text=Infrastructure Services;url=services/infrastructureservices/;");
aI("text=Managed Service;url=services/managedservice/;");
aI("text=Project Management;url=services/projectmanagement/;");
aI("text=Resource Delivery;url=services/resourcedelivery/;");
}
drawMenus();
Poster: John
Dated: Thursday May 3 2007 - 21:43:49 BST
Note the following code under MainMenu...
Code:
aI("showmenu=services;image=images/navbar/about-off.gif;overimage=images/navbar/about-on.gif;");
aI("showmenu=services;image=images/navbar/services-off.gif;overimage=images/navbar/services-on.gif;");
aI("showmenu=services;image=images/navbar/services-off.gif;overimage=images/navbar/services-on.gif;");
As you can see, both showmenu items are pointing to the same menu - namely services. Change one of the 'services' to 'aboutxeriom' (no quotes) to point to the other menu. I'll let you figure out which one...
Thanks John
Poster: Kelly McNeill
Dated: Thursday May 3 2007 - 22:59:40 BST
That did the trick.
I should have noticed that too.
Thanks for your help.
Poster: Ruth
Dated: Friday May 4 2007 - 5:05:33 BST
Hi Kelly,
No charge. We volunteer here Maybe if I need some images made I'll hit you up
Ruth
Re: Thanks John
Poster: John
Dated: Friday May 4 2007 - 16:25:37 BST
Kelly McNeill wrote:
That did the trick.
I should have noticed that too.
I should have noticed that too.
True. That's why I let you figure the last part of it out yourself...
Regardless, glad it's working now.