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:21
Windows Vista menu?
Poster: redtopia
Dated: Friday March 14 2008 - 1:09:22 GMT
Check out:
http://windowshelp.microsoft.com/Window ... fault.mspx
Can we create a menu like this?
Re: Windows Vista menu?
Poster: John
Dated: Friday March 14 2008 - 15:47:39 GMT
Yes. This would be an image-based menu. Go to http://www.milonic.com/, DHTML menu/DHTML Menu Samples, and look at the examples under Image Based Samples. You can download a copy of the menu code to give it a try. If you get stuck come on back.
Re: Windows Vista menu?
Poster: redtopia
Dated: Friday March 14 2008 - 16:12:34 GMT
The closest one I saw is:
http://www.milonic.com/menusample71.php
Looks possible!
Re: Windows Vista menu?
Poster: Ruth
Dated: Saturday March 15 2008 - 5:16:18 GMT
Hi,
It is possible. Take a look at this one. It uses buttons with the text on them which is what the Vista Menu does. No, it doesn't look the same because it has different buttons, you'd just have to create the buttons you want. The one you posted uses background images, but the Vistas one is actually button images with text on them.
http://www.milonic.com/menusample18.php
Ruth
Re: Windows Vista menu?
Poster: Ruth
Dated: Friday October 9 2009 - 21:28:06 BST
Hi,
You can use images and overimages to create that, or you can use css for the borders in the main and submenu. Here is an example I created using the data file in the menu download. I removed the samples menu because that does cause a problem given it is so long. But, you can see how this was done and how it looks. I've posted the data file, and also the html page since that is where I put the css coding. Make sure that the lines don't wrap when you copy/paste the code.
Data file, save this as test_data.js.
Code:
fixMozillaZIndex=true; //Fixes Z-Index problem with Mozilla browsers but causes odd scrolling problem, toggle to see if it helps
_menuCloseDelay=150;
_menuOpenDelay=150;
_subOffsetTop=0;
_subOffsetLeft=-7;
with(menuStyle1=new mm_style()){
bordercolor="#999999";
borderstyle="solid";
borderwidth=0;
fontfamily="Arial, Helvetica, Sans-serif";
fontsize="75%";
fontstyle="normal";
offbgcolor="#ddffdd";
offcolor="#000000";
onbgcolor="#ddffdd";
oncolor="#000099";
padding=4;
subimage="";
subimagepadding=0;
ondecoration="underline overline";
}
with(menuStyle=new mm_style()){
offclass="brdmainnosubOff";
onclass="brdmainnosubOn";
bordercolor="#999999";
borderstyle="solid";
borderwidth=0;
fontfamily="Verdana, Tahoma, Arial";
fontsize="75%";
fontstyle="normal";
offbgcolor="#eeeeee";
offcolor="#000000";
onbgcolor="#ddffdd";
oncolor="#000099";
padding=4;
}
with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
orientation="vertical";
style=menuStyle;
margin="5px";
aI("text=Home;url=http://www.milonic.com/;");
aI("showmenu=Milonic;text=Milonic;");
aI("showmenu=Partners;text=Partners;");
aI("showmenu=Links;text=Links;");
aI("showmenu=MyMilonic;text=My Milonic;");
}
with(milonic=new menuname("Milonic")){
style=menuStyle1;
aI("offclass=brdsubTop;onclass=brdsubTop;text=Product Purchasing Page;url=http://www.milonic.com/cbuy.php;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=Contact Us;url=http://www.milonic.com/contactus.php;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=Newsletter Subscription;url=http://www.milonic.com/newsletter.php;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=FAQ;url=http://www.milonic.com/menufaq.php;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=Discussion Forum;url=http://www.milonic.com/forum/;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=Software License Agreement;url=http://www.milonic.com/license.php;");
aI("offclass=brdsubBot;onclass=brdsubBot;text=Privacy Policy;url=http://www.milonic.com/privacy.php;");
}
with(milonic=new menuname("Partners")){
style=menuStyle1;
aI("offclass=brdsubTop;onclass=brdsubTop;text=(aq) Web Hosting;url=http://www.a-q.co.uk/;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=WebSmith;url=http://www.softidiom.com/?milonicmenu;");
aI("offclass=brdsubBot;onclass=brdsubBot;text=SMS 2 Email;url=http://www.sms2email.com/;");
}
with(milonic=new menuname("Links")){
style=menuStyle1;
aI("offclass=brdsubTop;onclass=brdsubTop;text=Apache Web Server;url=http://www.apache.org/;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=MySQL Database Server;url=http://ww.mysql.com/;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=PHP - Development;url=http://www.php.net/;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=phpBB Web Forum System;url=http://www.phpbb.net/;");
aI("offclass=brdsubBot;onclass=brdsubBot2ndLevel;showmenu=Anti Spam;text=Anti Spam Tools;");
}
with(milonic=new menuname("Anti Spam")){
style=menuStyle1;
aI("offclass=brdsubTop;onclass=brdsubTop;text=Spam Cop;url=http://www.spamcop.net/;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=Mime Defang;url=http://www.mimedefang.org/;");
aI("offclass=brdsubBot;onclass=brdsubBot;text=Spam Assassin;url=http://www.spamassassin.org/;");
}
with(milonic=new menuname("MyMilonic")){
style=menuStyle1;
aI("offclass=brdsubTop;onclass=brdsubTop;text=Login;url=http://www.milonic.com/login.php;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=Licenses;url=http://www.milonic.com/mylicenses.php;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=Invoices;url=http://www.milonic.com/myinvoices.php;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=Make Support Request;url=http://www.milonic.com/reqsupport.php;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=View Support Requests;url=http://www.milonic.com/mysupport.php;");
aI("offclass=brdsubBot;onclass=brdsubBot;text=Your Details;url=http://www.milonic.com/mydetails.php;");
}
drawMenus();
_menuCloseDelay=150;
_menuOpenDelay=150;
_subOffsetTop=0;
_subOffsetLeft=-7;
with(menuStyle1=new mm_style()){
bordercolor="#999999";
borderstyle="solid";
borderwidth=0;
fontfamily="Arial, Helvetica, Sans-serif";
fontsize="75%";
fontstyle="normal";
offbgcolor="#ddffdd";
offcolor="#000000";
onbgcolor="#ddffdd";
oncolor="#000099";
padding=4;
subimage="";
subimagepadding=0;
ondecoration="underline overline";
}
with(menuStyle=new mm_style()){
offclass="brdmainnosubOff";
onclass="brdmainnosubOn";
bordercolor="#999999";
borderstyle="solid";
borderwidth=0;
fontfamily="Verdana, Tahoma, Arial";
fontsize="75%";
fontstyle="normal";
offbgcolor="#eeeeee";
offcolor="#000000";
onbgcolor="#ddffdd";
oncolor="#000099";
padding=4;
}
with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
orientation="vertical";
style=menuStyle;
margin="5px";
aI("text=Home;url=http://www.milonic.com/;");
aI("showmenu=Milonic;text=Milonic;");
aI("showmenu=Partners;text=Partners;");
aI("showmenu=Links;text=Links;");
aI("showmenu=MyMilonic;text=My Milonic;");
}
with(milonic=new menuname("Milonic")){
style=menuStyle1;
aI("offclass=brdsubTop;onclass=brdsubTop;text=Product Purchasing Page;url=http://www.milonic.com/cbuy.php;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=Contact Us;url=http://www.milonic.com/contactus.php;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=Newsletter Subscription;url=http://www.milonic.com/newsletter.php;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=FAQ;url=http://www.milonic.com/menufaq.php;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=Discussion Forum;url=http://www.milonic.com/forum/;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=Software License Agreement;url=http://www.milonic.com/license.php;");
aI("offclass=brdsubBot;onclass=brdsubBot;text=Privacy Policy;url=http://www.milonic.com/privacy.php;");
}
with(milonic=new menuname("Partners")){
style=menuStyle1;
aI("offclass=brdsubTop;onclass=brdsubTop;text=(aq) Web Hosting;url=http://www.a-q.co.uk/;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=WebSmith;url=http://www.softidiom.com/?milonicmenu;");
aI("offclass=brdsubBot;onclass=brdsubBot;text=SMS 2 Email;url=http://www.sms2email.com/;");
}
with(milonic=new menuname("Links")){
style=menuStyle1;
aI("offclass=brdsubTop;onclass=brdsubTop;text=Apache Web Server;url=http://www.apache.org/;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=MySQL Database Server;url=http://ww.mysql.com/;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=PHP - Development;url=http://www.php.net/;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=phpBB Web Forum System;url=http://www.phpbb.net/;");
aI("offclass=brdsubBot;onclass=brdsubBot2ndLevel;showmenu=Anti Spam;text=Anti Spam Tools;");
}
with(milonic=new menuname("Anti Spam")){
style=menuStyle1;
aI("offclass=brdsubTop;onclass=brdsubTop;text=Spam Cop;url=http://www.spamcop.net/;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=Mime Defang;url=http://www.mimedefang.org/;");
aI("offclass=brdsubBot;onclass=brdsubBot;text=Spam Assassin;url=http://www.spamassassin.org/;");
}
with(milonic=new menuname("MyMilonic")){
style=menuStyle1;
aI("offclass=brdsubTop;onclass=brdsubTop;text=Login;url=http://www.milonic.com/login.php;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=Licenses;url=http://www.milonic.com/mylicenses.php;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=Invoices;url=http://www.milonic.com/myinvoices.php;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=Make Support Request;url=http://www.milonic.com/reqsupport.php;");
aI("offclass=brdsubMid;onclass=brdsubMid;text=View Support Requests;url=http://www.milonic.com/mysupport.php;");
aI("offclass=brdsubBot;onclass=brdsubBot;text=Your Details;url=http://www.milonic.com/mydetails.php;");
}
drawMenus();
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Milonic DHTML/JavaScript Menu Sample Page</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<style type="text/css">
BODY{
FONT-FAMILY:verdana;
font-size:12px;
background-color:#FFFFFF;
}
.backG {
FONT-FAMILY:verdana;
background-color:#93c39b;
color:#ffffff;
border-bottom:#538c4d 2px solid;
font-size:12px;
}
td.form1
{
FONT-FAMILY:verdana;
background:#eaeaea;
font-size:12px;
}
.brdmainnosubOff{border:0px solid #626262;text-decoration:none;}
.brdmainnosubOn{border:1px solid #626262;text-decoration:none;}
.brdmainwithsubOn{border-top:1px solid #626262;border-right:0px solid #626262;border-bottom:1px solid #626262;border-left:1px solid #626262;text-decoration:none;}
.brdsubTop{border-top:1px solid #626262;border-right:1px solid #626262;border-bottom:0px solid #626262;border-left:0px solid #626262;text-decoration:none;}
.brdsubMid{border-top:0px solid #626262;border-right:1px solid #626262;border-bottom:0px solid #626262;border-left:1px solid #626262;text-decoration:none;}
.brdsubBot{border-top:0px solid #626262;border-right:1px solid #626262;border-bottom:1px solid #626262;border-left:1px solid #626262;text-decoration:none;}
.brdsubBot2ndLevel{border-top:1px solid #626262;border-right:0px solid #626262;border-bottom:1px solid #626262;border-left:1px solid #626262;text-decoration:none;}
</style>
</head>
<body>
<!--
Milonic DHTML Website Navigation Menu Version 5.0+
Copyright 2006 (c) Milonic Solutions Limited (UK). All Rights Reserved.
Please visit http://www.milonic.com/ for more information.
Although this software may have been freely downloaded, you must obtain a license before using it in any production environment.
The free use of this menu is only available for Non-Profit, Educational & Personal Web Sites who have obtained a license to use.
Free, Commercial and Corporate Licenses are available from our website.
You also need to include a link back to http://www.milonic.com/ if you use the free license.
All Copyright notices MUST remain in place at ALL times.
This includes the first three lines of this notice on every page that uses the menu.
If you cannot comply with all of the above requirements, please contact us to arrange a license waiver.
-->
<!-- ***** This is the section of code you need to paste into your web pages ***** -->
<script type="text/javascript" src="milonic_src.js"></script>
<script type="text/javascript" src="mmenudom.js"></script>
<noscript><a href=http://www.milonic.com/>Milonic JavaScript Menu is only visible when JavaScript is enabled</a></noscript>
<!-- The next file contains your menu data, links and menu structure etc -->
<script type="text/javascript" src="test_data.js"></script>
</body>
</html>
<html>
<head>
<title>Milonic DHTML/JavaScript Menu Sample Page</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<style type="text/css">
BODY{
FONT-FAMILY:verdana;
font-size:12px;
background-color:#FFFFFF;
}
.backG {
FONT-FAMILY:verdana;
background-color:#93c39b;
color:#ffffff;
border-bottom:#538c4d 2px solid;
font-size:12px;
}
td.form1
{
FONT-FAMILY:verdana;
background:#eaeaea;
font-size:12px;
}
.brdmainnosubOff{border:0px solid #626262;text-decoration:none;}
.brdmainnosubOn{border:1px solid #626262;text-decoration:none;}
.brdmainwithsubOn{border-top:1px solid #626262;border-right:0px solid #626262;border-bottom:1px solid #626262;border-left:1px solid #626262;text-decoration:none;}
.brdsubTop{border-top:1px solid #626262;border-right:1px solid #626262;border-bottom:0px solid #626262;border-left:0px solid #626262;text-decoration:none;}
.brdsubMid{border-top:0px solid #626262;border-right:1px solid #626262;border-bottom:0px solid #626262;border-left:1px solid #626262;text-decoration:none;}
.brdsubBot{border-top:0px solid #626262;border-right:1px solid #626262;border-bottom:1px solid #626262;border-left:1px solid #626262;text-decoration:none;}
.brdsubBot2ndLevel{border-top:1px solid #626262;border-right:0px solid #626262;border-bottom:1px solid #626262;border-left:1px solid #626262;text-decoration:none;}
</style>
</head>
<body>
<!--
Milonic DHTML Website Navigation Menu Version 5.0+
Copyright 2006 (c) Milonic Solutions Limited (UK). All Rights Reserved.
Please visit http://www.milonic.com/ for more information.
Although this software may have been freely downloaded, you must obtain a license before using it in any production environment.
The free use of this menu is only available for Non-Profit, Educational & Personal Web Sites who have obtained a license to use.
Free, Commercial and Corporate Licenses are available from our website.
You also need to include a link back to http://www.milonic.com/ if you use the free license.
All Copyright notices MUST remain in place at ALL times.
This includes the first three lines of this notice on every page that uses the menu.
If you cannot comply with all of the above requirements, please contact us to arrange a license waiver.
-->
<!-- ***** This is the section of code you need to paste into your web pages ***** -->
<script type="text/javascript" src="milonic_src.js"></script>
<script type="text/javascript" src="mmenudom.js"></script>
<noscript><a href=http://www.milonic.com/>Milonic JavaScript Menu is only visible when JavaScript is enabled</a></noscript>
<!-- The next file contains your menu data, links and menu structure etc -->
<script type="text/javascript" src="test_data.js"></script>
</body>
</html>
Hope this gives you some idea of how to do this. As I said you can also do it with images setting them up to 'match' to give you what you want.
Ruth
Re: Windows Vista menu?
Poster: redtopia
Dated: Tuesday October 6 2009 - 15:47:59 BST
I realize the top level menu is easy... image based, no problem. What I was getting at is how the submenus are built, Check them out. The first level submenu is horizontal and subsequent third is vertical.
Re: Windows Vista menu?
Poster: Ruth
Dated: Tuesday October 6 2009 - 16:39:43 BST
Hi,
You just have to code the orientation in the menus for which way to open. Default is vertical.
main menu would be orientation="horizontal";
secondary level menus would be orientation="horizontal";
third level would be orientation="vertical"; and so on for however many levels you want and how you want them to open.
Ruth
Re: Windows Vista menu?
Poster: redtopia
Dated: Tuesday October 6 2009 - 20:34:46 BST
I recently saw this menu too, and I thought that it was cool, but maybe not possible with Milonic. Is this one possible?
http://www.dpreview.com/
Re: Windows Vista menu?
Poster: Ruth
Dated: Wednesday October 7 2009 - 11:55:20 BST
I play with different styles and that one looks like it is doable. I'll play around and get back to you
Ruth
Re: Windows Vista menu?
Poster: redtopia
Dated: Wednesday October 7 2009 - 15:45:49 BST
I wasn't sure how you could make a border that encompasses both the main menu and the submenus without a divider between them.
Re: Windows Vista menu?
Poster: redtopia
Dated: Friday October 9 2009 - 21:57:12 BST
Yea, that works, though I had to set the _menuOpenDelay to 0 so the menu worked smoothly. Otherwise, you could see the right border line being drawn and it looked messy.
Nice work... I might have to use that one.