Using pagematch with listmenu???

Having problems with DHTML Menu? There is usually somebody here who knows the answer.
Post Reply
doronca
Advanced
Advanced
Posts: 12
Joined: Mon Jun 16, 2003 11:57 am

Using pagematch with unordered lists

Post by doronca »

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.
User avatar
John
 Team
 Team
Posts: 5967
Joined: Sun May 19, 2002 8:23 pm
Location: Phoenix, AZ
Contact:

Post by John »

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://milonic.com/">JavaScript Menu Powered by Milonic</a></div>

...is unacceptable. That link must be visible.
doronca
Advanced
Advanced
Posts: 12
Joined: Mon Jun 16, 2003 11:57 am

Link to Milonic

Post by doronca »

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
User avatar
Ruth
 Team
 Team
Posts: 8763
Joined: Thu May 15, 2003 5:02 am
Location: Yucaipa, CA
Contact:

Post by Ruth »

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
doronca
Advanced
Advanced
Posts: 12
Joined: Mon Jun 16, 2003 11:57 am

pagematch

Post by doronca »

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
User avatar
Ruth
 Team
 Team
Posts: 8763
Joined: Thu May 15, 2003 5:02 am
Location: Yucaipa, CA
Contact:

Post by Ruth »

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
doronca
Advanced
Advanced
Posts: 12
Joined: Mon Jun 16, 2003 11:57 am

Setting a pagematch when using unordered lists

Post by doronca »

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.
Last edited by doronca on Wed Nov 29, 2006 8:53 pm, edited 1 time in total.
User avatar
Ruth
 Team
 Team
Posts: 8763
Joined: Thu May 15, 2003 5:02 am
Location: Yucaipa, CA
Contact:

Post by Ruth »

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
doronca
Advanced
Advanced
Posts: 12
Joined: Mon Jun 16, 2003 11:57 am

Keeping stuff together

Post by doronca »

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:

viewtopic.php?p=39796
User avatar
Andy
Milonic
Milonic
Posts: 3308
Joined: Sun May 19, 2002 8:23 pm
Location: Menu Developer
Contact:

Post by Andy »

Thanks Doron :D

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

-- Andy
User avatar
Ruth
 Team
 Team
Posts: 8763
Joined: Thu May 15, 2003 5:02 am
Location: Yucaipa, CA
Contact:

Post by Ruth »

Hi Doron,

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

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
doronca
Advanced
Advanced
Posts: 12
Joined: Mon Jun 16, 2003 11:57 am

Setting selected item with javascript or css

Post by doronca »

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.
User avatar
Ruth
 Team
 Team
Posts: 8763
Joined: Thu May 15, 2003 5:02 am
Location: Yucaipa, CA
Contact:

Post by Ruth »

Merry Christmas and Happy New Year to you :)
doronca
Advanced
Advanced
Posts: 12
Joined: Mon Jun 16, 2003 11:57 am

Here is the code from my broken URL's

Post by doronca »

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/shoppi ... 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? ... AQ</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_overvie ... le</a></li>
<li><a href="http://www.client.com/corporate_affilia ... es</a></li>
<li><a href="http://www.client.com/corporate_affilia ... >Affiliate Program</a></li>
<li><a href="http://www.client.com/corporate_partner ... rs</a></li>
<li><a href="http://www.client.com/corporate_employm ... bs</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/shoppi ... .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://milonic.com/">JavaScript Menu Powered by Milonic</a></div>
</body>
</html>
Post Reply