Milonic provide full featured pull down web menus for some of the worlds largest companies
click here to see what it can do for you

Download Milonic DHTML Menu
Buy Milonic DHTML Menu

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:47

Using pagematch with unordered lists


Poster: doronca
Dated: Tuesday November 28 2006 - 8:17:37 GMT

Hi,

I would like that Products & Technology be selected when in this page:
http://www.dominol.secured.co.il/projec ... nload.html

Do you know how can I use the pagematch (or anything else) with unordered lists?

BTW, if I can place this property after the whole code (or before) it is better as I will be able to place the whole code in include file.

Thanks.


Poster: John
Dated: Tuesday November 28 2006 - 14:06:32 GMT

Hi,

Gotta be a little picky here.

You need to upgrade your code to the current version for support here in the forum - 5.764 as of this writing.

Also, this (specifically the display:none)...

<div style="display:none;"><a href="http://www.milonic.com/">JavaScript Menu Powered by Milonic</a></div>

...is unacceptable. That link must be visible.

Link to Milonic


Poster: doronca
Dated: Tuesday November 28 2006 - 17:36:16 GMT

Hi,

Milonic license has been purchased for http://www.trustware.com. The div style is only here so the client will see how it looks like...
Since it doesn't matter anymore I put the link back in.

I've upgraded the code but couldn't understand how to perform it


Poster: Ruth
Dated: Tuesday November 28 2006 - 20:00:08 GMT

Hi,

I'm sorry, I don't know what you mean about performing it.

If you have a licensed product, you should go to the main site, log in under the name you registered for purchasing the menu, then click on download and download the newest version. When you are logged in this will download your licensed version. The version you downloaded right now is the unlicensed version, so you don't want o over write the original files at the trustware site with these. The only 3 files you upload are the milonic_src.js, mmenudom.js mmenuns4.js files. Keep your own data file.

If you're talking about the pagematching, I [and John probably] are still tyring to find out how to do that with a listmenu, if it is possible.

Ruth

pagematch


Poster: doronca
Dated: Tuesday November 28 2006 - 20:41:27 GMT

Hi,

I indeed meant the pagematch stuff, other than that the menu functions just great. I was thinking to do place a class on the item itself but it seems to me very problematic...

Thanks for your help anyway and I'll download the licensed version


Poster: Ruth
Dated: Wednesday November 29 2006 - 4:31:50 GMT

Hi,

I have posted a question to Milonic, just to be completely sure, but I don't believe this is going to be possible. Unlike a regular Milonic menu where you can use the various properties in the items, the listmenu has no way to do that. It is, more or less' saying, hmm I have no menus, but wait, I see a UL list and I have listmenus.js telling me to use that to make a menu.

You can use the page properties in the style section. Those do work. So, if you have the url in the LI for that Products and Technology as a link to that page, then when you actually are on that page whatever you have set in the page properties will apply to the item. It will apply to all the items in the menu when there is a match. You could do something like pagecolor="#ff0000"; which would change the text color to red when there is a match to the item.

As to the openmenusbyurl.js file, I have tried that but that doesn't seem to work with the listmenu. Again, most likely because it is looking for a regularly coded submenu.

Ruth

Setting a pagematch when using unordered lists


Poster: doronca
Dated: Wednesday November 29 2006 - 10:27:12 GMT

Hello,

Here is my contribution to the Milonic's community.
The problem: how to set an item as matched while using unordered lists?
Solution:

In order to set a pagematch I had to use css since pagematch is a property that can't be used when you define your menu as unordered lists.
The trick here is to get rid of the padding property in the menuStyle and use css instead. Here is how:

First, I wrapped all main menu items with a span id="item" and set the right and left padding in css so the items will have some "space" when you mouseover them.

Second, I've added a class named "selected" and set the color & background color to match the selected item colors. To use it you just have to add this class to the span

Third, to enjoy some top & bottom padding I used the offclass and onclass.
Here are the final results:

Homepage selected
http://www.dominol.secured.co.il/projec ... epage.html

Some page selected
http://www.dominol.secured.co.il/projec ... nload.html

None selected
http://www.dominol.secured.co.il/projec ... nepro.html

Many thanks to John and especially to Ruth that helped me across this project !

Doron.


Poster: Ruth
Dated: Wednesday November 29 2006 - 18:52:29 GMT

Hi Doron,

Thanks so much for posting the solution. This will be a great help to others who want to do this, and for us when we get a question and can now give them a solution :)

Ruth

Keeping stuff together


Poster: doronca
Dated: Wednesday November 29 2006 - 19:24:13 GMT

Ruth, it is my pleasure to "pay it forward" to the community...

In order to help the users this whole thread is related to this one:

http://www.milonic.com/forum/viewtopic.php?p=39796


Poster: Andy
Dated: Wednesday November 29 2006 - 19:32:38 GMT

Thanks Doron :D

Wish we had more people like you, it's most appreciated

-- Andy


Poster: Ruth
Dated: Wednesday December 20 2006 - 5:34:14 GMT

Hi Doron,

I thought you might like to take a look at this post

http://www.milonic.com/forum/viewtopic. ... 0504#40504

Not sure if it will be useable to do the page stuff right from the aI, or if it would cause problems in the listmenu for those without js enabled, but since it had to do with the listmenu and using other things, I thought you might be interested.

Ruth

Setting selected item with javascript or css


Poster: doronca
Dated: Wednesday December 20 2006 - 7:59:22 GMT

Hi Ruth,

Thanks for the update. The solution offered by estebanms is quite similar to mine as we both use the content within the <a> tag. It seems though that using the javascript solution you can avoid the fine tuning of the padding so it might be even better. Personally I prefer css

Happy New Year,
Doron.


Poster: Ruth
Dated: Wednesday December 20 2006 - 12:34:29 GMT

Merry Christmas and Happy New Year to you :)

Here is the code from my broken URL's


Poster: doronca
Dated: Wednesday August 15 2007 - 21:43:01 BST

Hi All,

As per the client request I had to remove direct links to my samples. Therefore here is the menu code.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>client</title>
<link href="files/client.css" rel="stylesheet" type="text/css">
</head>
<body>
<script type="text/javascript" src="milonic/milonic_src.js"></script>
<script type="text/javascript">
if(ns4)_d.write("<scr"+"ipt type=text/javascript src=milonic/mmenuns4.js><\/scr"+"ipt>");
else _d.write("<scr"+"ipt type=text/javascript src=milonic/mmenudom.js><\/scr"+"ipt>");
</script>
<script type="text/javascript" src="milonic/listmenus.js"></script>
<table width="1024" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td><table width="1024" border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="top" class="barnav">
<table border=0 bordercolor="lime" cellpadding="0" cellspacing=0 width=1024 height=34>
<tr>
<td width="29%"> </td>
<td valign="middle" style="padding-top:10px;">
<!-- start menu HTML -->
<ul id="milonicmenu1">
<li><a href="http://www.client.com/"><span id="item" class="selected">Home</span></a></li>
<li><a href=#><span id="item">Products & Technology</span></a>
<ul class="subMenu1">
<li><a href="http://www.client.com/freeware.php">product Basic</a></li>
<li><a href="http://www.client.com/products.php">product Pro</a></li>
<li><a href="http://www.client.com/products.php">product Enterprise</a></li>
<li><a href="http://www.client.com/products.php">Comparison Table</a></li>
<li><a href="http://www.client.com/document_library.php">product Technology</a></li>
</ul>
</li>
<li><a href="http://www.client.com/oscommerce/shopping_cart.php"><span id="item">Buy Now</span></a></li>
<li><a href=#><span id="item">Support</span></a>
<ul class="subMenu3">
<li><a href="http://www.client.com/support.php">Support</a></li>
<li><a href="http://www.client.com/forum/">Forum</a></li>
<li><a href="http://www.client.com/products_faq.php?id=28">FAQ</a></li>
</ul>
</li>
<li><a href="http://www.client.com/document_library.php"><span id="item">Library</span></a></li>
<li><a href="http://www.client.com/corporate_news.php"><span id="item">News & Events</span></a></li>
<li><a href=#><span id="item">Company</span></a>
<ul class="subMenu2">
<li><a href="http://www.client.com/corporate_overview.php">Profile</a></li>
<li><a href="http://www.client.com/corporate_affiliates.php">Affiliates</a></li>
<li><a href="http://www.client.com/corporate_affiliates.php">Affiliate Program</a></li>
<li><a href="http://www.client.com/corporate_partners.php">Partners</a></li>
<li><a href="http://www.client.com/corporate_employment.php">Jobs</a></li>
<li><a href="http://www.client.com/contact.php">Contact Us</a></li>
<!-- <li><a href=#>Anti Spam Tools</a>
<ul class="subMenu3">
<li><a href=http://www.spamcop.net/>Spam Cop</a></li>
<li><a href=http://www.mimedefang.org/>Mime Defang</a></li>
<li><a href=http://www.spamassasin.com/>Spam Assassin</a></li>
</ul>
</li>-->
</ul>
</li>
</ul>
<script>
_menuCloseDelay=500;
_menuOpenDelay=150;
_subOffsetTop=2;
_subOffsetLeft=-2;

with(menuStyle=new mm_style()){
//bordercolor="#999999";
//borderstyle="solid";
//borderwidth=1;
fontfamily="arial, helvetica, sans-serif";
fontsize="12px";
fontstyle="normal";
fontweight = "bold";
//headerbgcolor="#ffffff";
//headercolor="#ffffff";
offbgcolor="transparent";
offcolor="#575759";
onbgcolor="#808080";
oncolor="#000005";
outfilter="randomdissolve(duration=0.3)";
//overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color=#777777', Direction=135, Strength=3)";
//padding=0;
//pagebgcolor="#82B6D7";
//pagecolor="black";
separatorcolor="#b84747";
separatorsize=1;
separatorheight=3;
separatorwidth=3;
separatoralign="middle";
separatorpadding=6;
//subimage="../../arrow.gif";
//subimagepadding=2;
//image="images/bullet.jpg";
//imagepadding="10";
//subimage = "";
//overimage='images/shakuf_6x6.gif';
offclass="mainmenucss";
onclass = "mainmenucss";
}

with(subMenu1=new mm_style()){
fontfamily="arial, helvetica, sans-serif";
fontsize="12px";
//fontstyle="normal";
//fontweight = "";
offbgcolor="#fefefe";
onbgcolor="#ffffff";
offcolor="#000000";
oncolor="#a84242";
separatorcolor="#ffffff";
separatorsize=0;
padding=0;
bordercolor="#999999";
borderstyle="solid";
borderwidth=1;
offclass="opaque";
onclass="opaque";
decoration="none";
ondecoration="none";
itemheight=8;
itemwidth=140;
overfilter="Fade(duration=0.2);Alpha(opacity=85);Shadow(color=#777777', Direction=135, Strength=3)";
onbold=1;
}

subMenu2=new copyOf(subMenu1);
subMenu2.itemwidth=110;

subMenu3=new copyOf(subMenu1);
subMenu3.itemwidth=55;

// syntax: buildListMenu("id of list", "menu style name", "main menu properties")
buildListMenu("milonicmenu1","menuStyle","alwaysvisible=true;orientation='horizontal';position='relative';")

</script>
</td>
</tr>
</table>

</td>
</tr>
<tr>
<td valign="top" class="backwolf"><table width="1024" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><table width="1024" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="120" height="83"> </td>
<td width="904" class="h1"> Security through<br>
Virtualization</td>
</tr>
<tr>
<td height="45"> </td>
<td class="h2"> Run alien files risk free</td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td height="26"> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td><a href="http://www.client.com/freeware.php"><img src="images/free_download_big.jpg" width="174" height="37" /></a></td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</table></td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top" class="back"><table width="1024" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="654"><table width="654" border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="top"><h3>product revolutionary virtualization technology, enables you to<br>
transparently run alien files and programs while protecting your PC assets<br>
and privacy from any known - and even unknown - Spyware, Adware and Virus<br>
attacks with no need whatsoever for security updates.<br>
</h3></td>
</tr>
<tr>
<td valign="top"><table width="654" border="0" cellspacing="0" cellpadding="0" >
<tr>
<td width="120" height="190"> </td>
<td width="171" valign="top">

<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="images/product_zone.jpg" width="91" height="19"></td>
</tr>
<tr>
<td class="h4">Basic</td>
</tr>
<tr>
<td><h5>P2P,Internet Browsers and IM Protection </h5></td>
</tr>
<tr>
<td><a class="more2" title="sample tooltip" href="http://www.client.com/products_techno.php">READ MORE >>></a></td>
</tr>
<tr>
<td><a href="http://www.client.com/freeware.php"><img src="images/free_download_small.jpg" width="101" height="21" /></a></td>
</tr>
</table>
</td>
<td width="151" valign="top" class="border"><table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td class="pad"><img src="images/product_zone.jpg" width="91" height="19"></td>
</tr>
<tr>
<td class="h4"><span class="pad">Pro</span></td>
</tr>
<tr>
<td valign="top" class="pad"><h5>Full PC Protection </h5></td>
</tr>
<tr>
<td><span class="pad"><a class="more2" href="http://www.client.com/products_home.php">READ MORE >>></a></span></td>
</tr>
<tr>
<td class="pad"><a href="http://www.client.com/products.php"><img src="images/button_30_days.jpg" width="101" height="21" /></a></td>
</tr>
<tr>
<td height="25" valign="bottom" class="pad"><a href="http://www.client.com/oscommerce/shopping_cart.php"><img src="images/button_buy_now.jpg" width="101" height="21" /></a></td>
</tr>
</table></td>
<td width="212" valign="top" class="border"><table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td class="pad"><img src="images/product_zone.jpg" width="91" height="19"></td>
</tr>
<tr>
<td class="h4"><span class="pad">Enterprise</span></td>
</tr>
<tr>
<td valign="top" class="pad"><h5>Enterprise Protection </h5></td>
</tr>
<tr>
<td><span class="pad"><a href="http://www.client.com/products_corp.php" class="more2" >READ MORE >>></a></span></td>
</tr>
<tr>
<td class="pad"> </td>
</tr>
</table></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td > </td>
</tr>
<tr>
<td> </td>
<td class="copyright">© client. All Rights Reserved </td>
<td class="copyright"><span class="pad border"><a href="http://www.iconception-multimedia.com/" target="_blank" class="copyr">Site by iConception</a></span></td>
<td > </td>
</tr>
</table></td>
</tr>
</table></td>
<td width="370" valign="top"><table width="370" border="0" cellspacing="0" cellpadding="6">
<tr>
<td height="58" valign="bottom" class="pad"><img src="images/spotlight2.gif" width="151" height="32" ></td>
</tr>
<tr>
<td height="43" valign="top" class="pad"><a href="http://www.client.com/corporate_news.php"><span class="text13">Title Title 1 /</span><span class="text10"> 8.21.2006</span><br>
<span class="text12">Here will come the text of the text .... </span></a></td>
</tr>
<tr>
<td height="56" valign="top" class="pad"><a href="http://www.client.com/corporate_news.php"><span class="text13">Title Title 1 /</span><span class="text10"> 8.21.2006</span><br>
<span class="text12">Here will come the text of the text .... </span></a></td>
</tr>
<tr>
<td height="93" class="pad"><table width="100%" border="0" cellpadding="0" cellspacing="0" class="backalready">
<tr>
<td class="counter">0003567125</td>
<!-- replace the above number with your php variable number_format($download_count) -->
</tr>
</table></td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
</table>
<div style="text-align:center;"><a href="http://www.milonic.com/">JavaScript Menu Powered by Milonic</a></div>
</body>
</html>