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

menu highlighting in table cells


Poster: flobadob
Dated: Thursday February 8 2007 - 11:28:37 GMT

Hello, I have a page divided into 4 table cells. 2 of the cells have milonic menus. The style of the menus were shamelessly copied from the frames example. When I click on a table cell containing a menu - but not on the actual menu itself, the menu and manu text change colour (presumably because the table cell is selected?). How can I turn off this behaviour?

thanks
Kristian.


Poster: Ruth
Dated: Friday February 9 2007 - 5:40:53 GMT

Hi,

Sorry, we have to see the page and the files to test this. There's no way for us to figure it out from the description. And, you're welcome to copy the style :)

Ruth


Poster: flobadob
Dated: Friday February 9 2007 - 9:51:43 GMT

I wrote the stuff in perl/mason but here is the resulting html output...

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Offshore Test Site</title>
</head>
<body>
<script language=JavaScript src="/lib/milonic_leftmenu/milonic_src.js" type=text/javascript></script>
<script language=JavaScript>
if(ns4) {
   _d.write("<scr"+"ipt language=JavaScript src=/lib/milonic_leftmenu/mmenuns4.js><\/scr"+"ipt>");
}
else {
   _d.write("<scr"+"ipt language=JavaScript src=/lib/milonic_leftmenu/mmenudom.js><\/scr"+"ipt>");
}
</script>


<script language=JavaScript>
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;


with(menuStyle=new mm_style()){
onbgcolor="#9EE3A9";
oncolor="#1D3B23";
offbgcolor="#61A76D";
offcolor="#F7F9F7";
bordercolor="#367E45";
borderstyle="solid";
borderwidth=1;
separatorcolor="#325235";
separatorsize=2;
padding=4;
fontsize=12;
fontstyle="normal";
fontfamily="Verdana, Tahoma, Arial";
subimage="/share/images/milonic/submenu_arrow_right-off.gif";
onsubimage="/share/images/milonic/submenu_arrow_right-on.gif";
high3dcolor="#FFFFFF";
low3dcolor="#367E45";
swap3d=1;
}
</script>


<table>
<tr>
<td><img src=/share/branding/Aerospace3DLogo.gif alt="AMI logo"></td>
<td><script language=JavaScript>

with(milonic=new menuname("sub1")){
   style=menuStyle;
   aI("text=Europe;target=mainiframe;url=/imageviewer.mas?path=/var/www/data/satpics/europe_color/®ex=\\d{12}\\.jpg;");
   aI("text=Africa;target=mainiframe;url=/imageviewer.mas?path=/var/www/data/satpics/africa_color/®ex=\\d{12}\\.jpg;");
}
drawMenus();

with(milonic=new menuname("Header Menu")){
   alwaysvisible=1;
   orientation="horizontal";
   style=menuStyle;
   aI("text=Home;url=http://www.milonic.com/;");
   aI("text=sub1test;showmenu=sub1;");
}
drawMenus();

</script>
</td>
</tr>
<tr>
<td>
<script language=JavaScript>
with(milonic=new menuname("satpicsSubmenu")){
style=menuStyle;
   aI("text=Europe;target=mainiframe;url=/imageviewer.mas?path=/var/www/data/satpics/europe_color/®ex=\\d{12}\\.jpg;");
   aI("text=Africa;target=mainiframe;url=/imageviewer.mas?path=/var/www/data/satpics/africa_color/®ex=\\d{12}\\.jpg;");
}
drawMenus();
with(milonic=new menuname("Main Menu")){
   alwaysvisible=1;
   left=0;
   menuwidth="148";
   menualign="center";
   overflow="scroll";
   style=menuStyle;
   top=100;
   aI("text=Satpics;showmenu=satpicsSubmenu;");
}
drawMenus();
</script>
</td>
<td><iframe name=mainiframe frameborder=0 scrolling=no width=1100 height=1100>
</iframe>
</td>
</tr>
</table>
</body>
</html>


Poster: Ruth
Dated: Friday February 9 2007 - 21:39:30 GMT

Hi,

OK, I know nothing about perl [aren't they some kind of gem] nor about Mason [brick-layers right ;) ], anyway, since I don't know about that, I'm not sure on how to tell you to set up the menu.

You seem to have the files placed in tables, so assuming you want the menus in the tables, that would be the main alwaysvisible menus, not the submenus. And, those main alwaysvisible menus, when in tables would have no top or left position, but rather they would have position="relative"; as their positions.

Using your page you posted, this would be the resulting page if the menus were placed correctly, both submenus would be up after the style and have a drawmenus at the end, and each main menu would be in its own script tags with a drawMenus(); at the end of each of those. NOTE: the one that is called main menu in that table cell the td has a valign=top tag to make the menu go to the top of the cell. If you want to position it someplace else in the cell you'd need to nest a table in that cell, position the table and then put the menu in that table.
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Offshore Test Site</title>
</head>
<body>
<script language=JavaScript src="milonic_src.js" type=text/javascript></script>
<script language=JavaScript>
if(ns4) {
   _d.write("<scr"+"ipt language=JavaScript src=mmenuns4.js><\/scr"+"ipt>");
}
else {
   _d.write("<scr"+"ipt language=JavaScript src=mmenudom.js><\/scr"+"ipt>");
}
</script>


<script language=JavaScript>
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;


with(menuStyle=new mm_style()){
onbgcolor="#9EE3A9";
oncolor="#1D3B23";
offbgcolor="#61A76D";
offcolor="#F7F9F7";
bordercolor="#367E45";
borderstyle="solid";
borderwidth=1;
separatorcolor="#325235";
separatorsize=2;
padding=4;
fontsize=12;
fontstyle="normal";
fontfamily="Verdana, Tahoma, Arial";
subimage="submenu_arrow_right-off.gif";
onsubimage="submenu_arrow_right-on.gif";
high3dcolor="#FFFFFF";
low3dcolor="#367E45";
swap3d=1;
}



with(milonic=new menuname("sub1")){
   style=menuStyle;
   aI("text=Europe;target=mainiframe;url=/imageviewer.mas?path=/var/www/data/satpics/europe_color/®ex=\\d{12}\\.jpg;");
   aI("text=Africa;target=mainiframe;url=/imageviewer.mas?path=/var/www/data/satpics/africa_color/®ex=\\d{12}\\.jpg;");
}

with(milonic=new menuname("satpicsSubmenu")){
style=menuStyle;
   aI("text=Europe;target=mainiframe;url=/imageviewer.mas?path=/var/www/data/satpics/europe_color/®ex=\\d{12}\\.jpg;");
   aI("text=Africa;target=mainiframe;url=/imageviewer.mas?path=/var/www/data/satpics/africa_color/®ex=\\d{12}\\.jpg;");
}
drawMenus();
</script>


<table border=1 bordercolor='red'>
<tr>
<td><img src=/Aerospace3DLogo.gif alt="AMI logo"></td>
<td>
<script language=JavaScript>
with(milonic=new menuname("Header Menu")){
   alwaysvisible=1;
   orientation="horizontal";
   style=menuStyle;
   position="relative";
   aI("text=Home;url=http://www.milonic.com/;");
   aI("text=sub1test;showmenu=sub1;");
}
drawMenus();

</script>
</td>
</tr>
<tr>
<td valign='top'>
<script language=JavaScript>
with(milonic=new menuname("Main Menu")){
   alwaysvisible=1;
   left=0;
   menuwidth="148";
   menualign="center";
   overflow="scroll";
   style=menuStyle;
position="relative";
   aI("text=Satpics;showmenu=satpicsSubmenu;");
}
drawMenus();
</script>
</td>
<td><iframe name=mainiframe frameborder=0 scrolling=no width=1100 height=1100>
</iframe>
</td>
</tr>
</table>
</body>
</html>


As I said, not knowing perl or mason and how you did the menus, I can only give you what the result should look like if you view source. Now, so you know, you can put all the submenus into the style file and actually call it like you did the milonic_src.js, mmenudom.js mmenuns4.js. Also, just so you know, you do not need the mmenuns4.js file unless you are coding so that users of Netscape4x can see the menu. I don't have any idea if your site is designed for that browsers functionality. If you decide you don't need to design for Netscape4x usability, then your calls would be

Code:
<script language=JavaScript src="milonic_src.js" type=text/javascript></script>
<script language=JavaScript> src=mmenudom.js</script>


And, if you put the subs and styles into a file, or into separate files, you'd call them the same way.

Hope this made sense.

Ruth


Poster: flobadob
Dated: Monday February 12 2007 - 11:16:05 GMT

erm, sorry you lost me on line 1. However, I have discovered that putting an <img> inside a table cell was causing the problem and changing this to an inline style such as...
Code:
<td style="background-image: url(/share/branding/Aerospace3DLogo.gif); background-repeat: no-repeat" width = 200 height=200>logo</td>

has fixed the problem.

rgds,
Kristian.


Poster: flobadob
Dated: Monday February 12 2007 - 14:09:42 GMT

Sorry my last reply about the image style thing was complete rubbish. The actual solution lies somewhere in the milonic menu setup. I have copy and pasted different example styles and now it works. I am guessing I had my horizontal and vertical mixed up. Dunno. Anyway it works now. thanks.


Poster: Ruth
Dated: Monday February 12 2007 - 20:28:15 GMT

Hi,

Please read the information on putting a menu in a table. These are called relatively positioned menus and the same information applies for putting the menu in a div. These type of menus don't just have the call for the files placed in the cell and the submenus don't get put into the table cell at all.

http://www.milonic.com/tablemenu.php

Ruth

©1998-2012 Milonic Solutions Ltd. UK Registered Company #4406835
Privacy Policy | License Agreement | Contact Us | Tech Support