new dhtmlmenu RT

lburgess17 · Post by **lburgess17** » Fri 23. Jun 2006, 00:56

oops. I will check that now. In the meantime, my CSS file looks like this:
I know it's that I just don't seem to know where to put my background images for the dropdown L2 sub-menus and where to put the background for the OnHover state of these L2 submenus. If you can point me in the right direction, I would be so grateful. My attempts have had limited success where it seems only viewable in either IE or FireFox & Netscape, but now cross-browser.

My dhtmlmenu.css is as follows:

#primaryNav {
/* margin: 0px 0px 0px 0px; */
background-color:#FFFFFF;
background-image: url(../../../images/nav_bkg.gif);
background-repeat: no-repeat;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 80%;
height: 32px;
padding: 0;
margin: 0;
}

/* here we set the default display for the lists/nested lists */
#primaryNav ul { /*LB - display for top list*/
margin: 0;
padding: .6em 0 0 0;
list-style-type: none;
float: right;
}

#primaryNav ul ul { /*LB - display for nested list*/
display: none;
position: absolute;
width: 192px;

/*border-bottom: 1px solid #ccc; */
top: 25px; /*LB- controls how far down the dropdown submenu starts from the L1 heading*/
left: 0px;
}
/*Paul Start--------------------------------------------------------------------------------*/
/*#primaryNav ul ul li a.submenu {
background-image: url(../../../picture/arrowWhite.gif);
background-repeat: no-repeat;
background-position: 100% .4em;
padding-right: .6em;
} */
/*Paul End--------------------------------------------------------------------------------*/
/*Hendrik Start---------------------------------------------------------------------*/
/*#primaryNav #alias {

}
#primaryNav #alias li{

}
#primaryNav .itemOn {
font-weight: bold;
color: blue;
}
#primaryNav .itemOnFirst {
font-weight: bold;
color: blue;
background-image: url(../../../picture/d_arrow.gif);
background-repeat: no-repeat;
background-position: 98% .5em;
padding-right: .6em;
}
#primaryNav .itemOnFirst ul{
font-style: normal;
}
#primaryNav .itemChoosen {
font-weight: bold;
color: #fff;
background: #555;
}
#primaryNav .itemChoosenFirst {
font-weight: bold;
color: #123;
}
#primaryNav .itemChoosen ul{
font-variant: normal;
}
#primaryNav .itemChoosenFirst ul{
font-variant: normal;
} */
/*Hendrik End---------------------------------------------------------------------*/

/* Fix IE. Hide from IE Mac \*/
* html #primaryNav ul ul { top: 25px; left: 0px; width: 170px;} /*LB- controls how far down the dropdown submenu starts from the L1 heading*/
/* End */

#primaryNav ul ul ul {
display: none;
position: absolute;
left: 190px;
top: -1px;

}

/* Fix IE. Hide from IE Mac \*/
* html #primaryNav ul ul ul { left: 170px; top: -1px; }
/* End */

/* here we set the default display for the list items/nested list items */
#primaryNav ul li { /*LB - positioning controls WHERE the dropdown menus will be placed on the screen, ie under L1 heading, bkg is the li bullet in original state.*/
margin: 0px;
padding: 4px 0px;
float: left;
position: relative;
font-weight: bold;
background-image:url(../../../images/li_bullet.gif);
background-repeat:no-repeat;
background-position: 0 50%;
text-decoration: none;

}

#primaryNav ul li li { /*LB- controls the actual LOOK/APPEARANCE of the L2 dropdown menu items*/
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
/* border: 1px solid #ccc; */
border-bottom: 0px;
float: none;
display: block;
font-weight: normal;
background-image: none; /*removes li bullet image in IE*/

}

/* here we set the default display state for the links */
#primaryNav ul li a { /*LB - controls how the L1 navigation links look/appear - top horizontally*/
padding: 5px 20px 5px 5px;
display: inline;
text-decoration: none;
padding: 0 15px 0 15px;
color: #005f8c;/*LB text color for L1 top/horizontal nav for IE*/
display: inline;/*LB added*/
}

#primaryNav ul li li a { /*L2 navigation*/
padding: 5px 10px 5px 10px; /*LB - controls the padding size of the dropdown box*/
display: block;
width: 170px;
background-image: none;/*LB - takes the li bkg image away on the nested dropdown menu items*/

}

/* Fix IE. Hide from IE Mac \*/
* html #primaryNav ul li { float: left; height: 1%; }
* html #primaryNav ul li a { height: 1%; }
/* End */

/* here we set the ACTIVE class for ON menus, first for cascade */
#primaryNav ul.itemOff { color: #005f8c; /*color: #FF3300; */}

/* DEFINE DEFAULT LI/A APPEARANCE */
/* here we set the standard LI states - controls bg color */
#primaryNav ul li { background-color: transparent; /*color: #666666;*/ } /*L1* main nav*/
#primaryNav ul li li { background-color: transparent; color: #777; } /*L2 first submenu*/
#primaryNav ul li li li { background-color: #ffffff; color: #777; } /*L3 third submenu*/
#primaryNav ul li li li li { background-color: #f9f9f9; color: #777; } /*L4 fourth submenu*/

/* here we set the standard A states - controls text color */
#primaryNav ul li a { color: inherit; }

/* Fix IE. Hide from IE Mac \*/
* html #primaryNav ul li a { /*color: #666666; */}
* html #primaryNav ul li li a { color: #777; }
/* End */

/* DEFINE DEFAULT LI/A HOVER/ON APPEARANCE */
/* here we set the hover and "in" styles for elements */
/* L1 on states */ /*LB- adds on hover red dot bkg to level 1 main nav*/
#primaryNav li:hover, #primaryNav li.sfhover a { color: #cd363d; background: url(../../../images/li_bullet_hvr.gif) 0 50% no-repeat; }
/* L1 off states - for children */ /*LB-removes OnHover red dot bkg fromlevel 2 dropdown menus*/
#primaryNav li:hover li, #primaryNav li.sfhover li a { color: #005f8c; background-image:none; }

/* L2 on states */
#primaryNav li li:hover, #primaryNav li li.sfhover a { color: #FF3300; }
/* L2 off states - for children */
#primaryNav li li:hover li, #primaryNav li li.sfhover li a { color: #777; }

/* global states - bg colors */
#primaryNav li li:hover, #primaryNav li li.sfhover, #primaryNav li li li:hover, #primaryNav li li li.sfhover {

}

/* DEFINE MENU APPEARANCE BEHAVIORS */
/* here we set the reveal/hide chains for the fly-out */
#primaryNav li:hover ul ul, #primaryNav li:hover ul ul ul {
display: none;
}

#primaryNav li:hover ul, #primaryNav li li:hover ul, #primaryNav li li li:hover ul {
display: block;
}

#primaryNav li.sfhover ul ul, #primaryNav li.sfhover ul ul ul, #primaryNav li li.sfhover ul ul {
display: none;
}

#primaryNav li.sfhover ul, #primaryNav li.sfhover ul, #primaryNav li li.sfhover ul, #primaryNav li li li.sfhover ul {
display: block;
}

LBurgess17

hendrik · Post by **hendrik** » Fri 23. Jun 2006, 11:15

lburgess17 wrote:oops. I will check that now. In the meantime, my CSS file looks like this:

Hi, not quite sure, but maybe this works:

Changes on line 119 (put in your Level2 image),
139, 173 and 176 (put in your Level2-hover-image).

Code: Select all

#primaryNav {
/* margin: 0px 0px 0px 0px; */
background-color:#FFFFFF;
background-image: url(../../../images/nav_bkg.gif);
background-repeat: no-repeat;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 80%;
height: 32px;
padding: 0;
margin: 0;
}

/* here we set the default display for the lists/nested lists */
#primaryNav ul { /*LB - display for top list*/
margin: 0;
padding: .6em 0 0 0;
list-style-type: none;
float: right;
}

#primaryNav ul ul { /*LB - display for nested list*/
display: none;
position: absolute;
width: 192px;



/*border-bottom: 1px solid #ccc; */
top: 25px; /*LB- controls how far down the dropdown submenu starts from the L1 heading*/
left: 0px;
}
/*Paul Start--------------------------------------------------------------------------------*/
/*#primaryNav ul ul li a.submenu {
background-image: url(../../../picture/arrowWhite.gif);
background-repeat: no-repeat;
background-position: 100% .4em;
padding-right: .6em;
} */
/*Paul End--------------------------------------------------------------------------------*/
/*Hendrik Start---------------------------------------------------------------------*/
/*#primaryNav #alias {

}
#primaryNav #alias li{

}
#primaryNav .itemOn {
font-weight: bold;
color: blue;
}
#primaryNav .itemOnFirst {
font-weight: bold;
color: blue;
background-image: url(../../../picture/d_arrow.gif);
background-repeat: no-repeat;
background-position: 98% .5em;
padding-right: .6em;
}
#primaryNav .itemOnFirst ul{
font-style: normal;
}
#primaryNav .itemChoosen {
font-weight: bold;
color: #fff;
background: #555;
}
#primaryNav .itemChoosenFirst {
font-weight: bold;
color: #123;
}
#primaryNav .itemChoosen ul{
font-variant: normal;
}
#primaryNav .itemChoosenFirst ul{
font-variant: normal;
} */
/*Hendrik End---------------------------------------------------------------------*/

/* Fix IE. Hide from IE Mac \*/
* html #primaryNav ul ul { top: 25px; left: 0px; width: 170px;} /*LB- controls how far down the dropdown submenu starts from the L1 heading*/
/* End */


#primaryNav ul ul ul {
display: none;
position: absolute;
left: 190px;
top: -1px;

}

/* Fix IE. Hide from IE Mac \*/
* html #primaryNav ul ul ul { left: 170px; top: -1px; }
/* End */

/* here we set the default display for the list items/nested list items */
#primaryNav ul li { /*LB - positioning controls WHERE the dropdown menus will be placed on the screen, ie under L1 heading, bkg is the li bullet in original state.*/
margin: 0px;
padding: 4px 0px;
float: left;
position: relative;
font-weight: bold;
background-image:url(../../../images/li_bullet.gif);
background-repeat:no-repeat;
background-position: 0 50%;
text-decoration: none;

}

#primaryNav ul li li { /*LB- controls the actual LOOK/APPEARANCE of the L2 dropdown menu items*/
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
/* border: 1px solid #ccc; */
border-bottom: 0px;
float: none;
display: block;
font-weight: normal;
background-image: url(../../../images/LEVEL2_bkg.gif);; /*maybee you have to have this also under #primaryNav ul li li li for Level3*/



}

/* here we set the default display state for the links */
#primaryNav ul li a { /*LB - controls how the L1 navigation links look/appear - top horizontally*/
padding: 5px 20px 5px 5px;
display: inline;
text-decoration: none;
padding: 0 15px 0 15px;
color: #005f8c;/*LB text color for L1 top/horizontal nav for IE*/
display: inline;/*LB added*/
}

#primaryNav ul li li a { /*L2 navigation*/
padding: 5px 10px 5px 10px; /*LB - controls the padding size of the dropdown box*/
display: block;
width: 170px;
/*background-image: none;*/   /*LB - takes the li bkg image away on the nested dropdown menu items*/


}

/* Fix IE. Hide from IE Mac \*/
* html #primaryNav ul li { float: left; height: 1%; }
* html #primaryNav ul li a { height: 1%; }
/* End */


/* here we set the ACTIVE class for ON menus, first for cascade */
#primaryNav ul.itemOff { color: #005f8c; /*color: #FF3300; */}

/* DEFINE DEFAULT LI/A APPEARANCE */
/* here we set the standard LI states - controls bg color */
#primaryNav ul li { background-color: transparent; /*color: #666666;*/ } /*L1* main nav*/
#primaryNav ul li li { background-color: transparent; color: #777; } /*L2 first submenu*/
#primaryNav ul li li li { background-color: #ffffff; color: #777; } /*L3 third submenu*/
#primaryNav ul li li li li { background-color: #f9f9f9; color: #777; } /*L4 fourth submenu*/

/* here we set the standard A states - controls text color */
#primaryNav ul li a { color: inherit; }

/* Fix IE. Hide from IE Mac \*/
* html #primaryNav ul li a { /*color: #666666; */}
* html #primaryNav ul li li a { color: #777; }
/* End */

/* DEFINE DEFAULT LI/A HOVER/ON APPEARANCE */
/* here we set the hover and "in" styles for elements */
/* L1 on states */ /*LB- adds on hover red dot bkg to level 1 main nav*/
#primaryNav li:hover, #primaryNav li.sfhover a { color: #cd363d; background: url(../../../images/li_bullet_hvr.gif) 0 50% no-repeat; }
/* L1 off states - for children */ /*LB-removes OnHover red dot bkg fromlevel 2 dropdown menus*/
#primaryNav li:hover li, #primaryNav li.sfhover li a { color: #005f8c; /*background-image:none; */}

/* L2 on states */
#primaryNav li li:hover, #primaryNav li li.sfhover a { color: #FF3300; background-image: url(../../../images/LEVEL2_hover_bkg.gif);}
/* L2 off states - for children */
#primaryNav li li:hover li, #primaryNav li li.sfhover li a { color: #777; }



/* global states - bg colors */
#primaryNav li li:hover, #primaryNav li li.sfhover, #primaryNav li li li:hover, #primaryNav li li li.sfhover {

}

/* DEFINE MENU APPEARANCE BEHAVIORS */
/* here we set the reveal/hide chains for the fly-out */
#primaryNav li:hover ul ul, #primaryNav li:hover ul ul ul {
display: none;
}

#primaryNav li:hover ul, #primaryNav li li:hover ul, #primaryNav li li li:hover ul {
display: block;
}

#primaryNav li.sfhover ul ul, #primaryNav li.sfhover ul ul ul, #primaryNav li li.sfhover ul ul {
display: none;
}

#primaryNav li.sfhover ul, #primaryNav li.sfhover ul, #primaryNav li li.sfhover ul, #primaryNav li li li.sfhover ul {
display: block;
}

does it work?

Hendrik

lburgess17 · Post by **lburgess17** » Fri 23. Jun 2006, 12:08

Hendrik,

YES! It works!

------------------------------
Changes on line 119 and 173 (put in your Level2 image),
139, and 176 (put in your Level2-hover-image).
--------------------------------

Thank you so much for your help!
-lburgess17

hendrik · Post by **hendrik** » Fri 23. Jun 2006, 12:38

thanks for thanks, guys
pleased to be able to help!

regards
Hendrik

lburgess17 · Post by **lburgess17** » Fri 23. Jun 2006, 13:44

As I am working with this menu, is it possible to extend the functionality to the following:

1. the drop-down/popup menu for the level 2/3/4 items (which currently does),

2. but at the same time when OnHover, it could also change an image somwhere on the page?

see: http://meyerweb.com/eric/css/edge/popups/demo2.html for example.

In my current menu (above post), I am wondering if these to OnHover functions can work at the same time... ie dropdown menu buttons appear when hovering over L1 links AND an image on the page would change based on hovering over the L1 links.

Seems too complex for me, wondering if anyone thinks it is possible.

thanks,
lburgess17

hendrik · Post by **hendrik** » Fri 23. Jun 2006, 15:44

lburgess17 wrote:As I am working with this menu, is it possible to extend the functionality to the following:

1. the drop-down/popup menu for the level 2/3/4 items (which currently does),

2. but at the same time when OnHover, it could also change an image somwhere on the page?

see: http://meyerweb.com/eric/css/edge/popups/demo2.html for example.

The following should work:

replace in dhtmlmenu.php at about line 97

Code: Select all

// Paul: change and add END
// **************************************************************************

         } else {
            $redirect = get_redirect_link($GLOBALS['content']['struct'][$key]["acat_redirect"], ' ', '');
            $s .= '<a href="'.$redirect['link'].'"'.$redirect['target'].'>';
         }

         $s .= html_specialchars($GLOBALS['content']['struct'][$key]['acat_name']);
         $s .= '</a>';

by

Code: Select all

// Paul: change and add END
// **************************************************************************

         } else {
            $redirect = get_redirect_link($GLOBALS['content']['struct'][$key]["acat_redirect"], ' ', '');
            $s .= '<a href="'.$redirect['link'].'"'.$redirect['target'].'>';
         }
// Hendrik: add: creating img tags with src-names from structure-aliases (mind giving proper alias names!)
if (!$GLOBALS['content']['struct'][$key]['acat_struct']) $s .= '<img src="picture/'.$GLOBALS['content']['struct'][$key]['acat_alias'].'.jpg">';
// Hendrik end
         $s .= html_specialchars($GLOBALS['content']['struct'][$key]['acat_name']);
         $s .= '</a>';

have a look to the new sourcecode and place your images with the right names into the picture-folder,
then use Eric Meyers css.
And show us when ready

!

Hendrik

Keppn · Post by **Keppn** » Fri 23. Jun 2006, 17:15

Hi everyone!

What a great Menu, it really fits exactly my needs!

I integrated the menu in my site, and it works very well with Firefox.
With Internet Explorer however, there are several glitches in the appearance. Since I'm just learning CSS, I just can't figure out where to change what, to have IE show the site just as Firefox

I hope some one can help me, help is very much appreciated!

Link to work-in-progress-site: http://www.wig-gerresheim.net/index.php

CSS: (I hope I didn't break anything with my amateurish CSS-skills

)

Code: Select all

#primaryNav {
   	margin: 0px 0px 0px 0px;
	padding-top: 69px;
	font-size: 13px;
   }

/* here we set the default display for the lists/nested lists */
#primaryNav ul {
   margin: 10px 0px 0px -1px;
   padding: 0px 0px 0px 0px;
	border-right: 1px solid #5b8285;
	border-left: 1px solid #5b8285;
   	border-bottom: 1px solid #5b8285;
	line-height: 170%;
   list-style: none;
   display: block;
   width: auto;
   }
   
#primaryNav ul ul {
   display: none;
   position: absolute;
   width: 192px;
   top: 20px;
   left: 0px;
   }
/*Paul Start--------------------------------------------------------------------------------*/
#primaryNav ul ul li a.submenu {
   background-image: url(../../picture/arrowWhite.gif);
   background-repeat: no-repeat;
   background-position: 100% .4em;
   padding-right: .6em;
}
/*Paul End--------------------------------------------------------------------------------*/
/*Hendrik Start---------------------------------------------------------------------*/
#primaryNav #alias {
   
}
#primaryNav #alias li{
   
}
#primaryNav .itemOn {
   font-weight: bold;
   color: blue;
}
#primaryNav .itemOnFirst {
   font-weight: bold;
   color: #FFFFFF;
background-color: #d86b00;

   background-image: url(../../picture/d_arrow.gif);
   background-repeat: no-repeat;
   background-position: 98% .5em;
   padding-right: .6em;
}
#primaryNav .itemOnFirst ul{
   font-style: normal;
}
#primaryNav .itemChoosen {
   font-weight: bold;
   color: #5b8285;
   background: #e1e8e9;
} 
#primaryNav .itemChoosenFirst {
   font-weight: bold;
   color: #123;
}   
#primaryNav .itemChoosen ul{
   font-variant: normal;
}
#primaryNav .itemChoosenFirst ul{
   font-variant: normal;
}   
/*Hendrik End---------------------------------------------------------------------*/

   /* Fix IE. Hide from IE Mac \*/
   * html #primaryNav ul ul { top: 19px; left: -1px; width: 170px;}
   /* End */
   
   
#primaryNav ul ul ul {
   display: none;
   position: absolute;
   left: 190px;
   top: -1px;
   }

   /* Fix IE. Hide from IE Mac \*/
   * html #primaryNav ul ul ul { left: 170px; top: -2px;}
   /* End */

/* here we set the default display for the list items/nested list items */
#primaryNav ul li {
   margin: 0px 0px 0px 0px;
   padding: 4px 0px 4px 0px;
   float: left;
   position: relative;
   font-weight: bold;
   }

#primaryNav ul li li {
   margin: 0px 0px 0px 0px;
   padding: 0px 0px 0px 0px;
   border-bottom: 0px;
   float: none;
   display: block;
   font-weight: normal;
   }

/* here we set the default display state for the links */
#primaryNav ul li a {
   padding: 5px 20px 5px 5px;
   display: inline;
   text-decoration: none;
   }
   
#primaryNav ul li li a {
   padding: 5px 10px 5px 10px;
   display: block;
   width: 170px;
   }

   /* Fix IE. Hide from IE Mac \*/
   * html #primaryNav ul li { float: left; height: 5%; }
   * html #primaryNav ul li a { height: 5%; }
   /* End */
   

/* here we set the ACTIVE class for ON menus, first for cascade */
#primaryNav ul.itemOff { color: #FF3300; /*color: #FF3300;*/ }

/* DEFINE DEFAULT LI/A APPEARANCE */
/* here we set the standard LI states - controls bg color */
#primaryNav ul li { background-color: transparent; color: #FFFFFF; padding-left: 10px;}
#primaryNav ul li li { background-color: #FFFFFF; color: #777; }
#primaryNav ul li li li { background-color: #ffffff; color: #777; }
#primaryNav ul li li li li { background-color: #f9f9f9; color: #777; }

/* here we set the standard A states - controls text color */
#primaryNav ul li a { color: inherit; }

   /* Fix IE. Hide from IE Mac \*/
   * html #primaryNav ul li a { color: #FFFFFF; }
   * html #primaryNav ul li li a { color: #777; }
   /* End */

/* DEFINE DEFAULT LI/A HOVER/ON APPEARANCE */
/* here we set the hover and "in" styles for elements */
   /* L1 on states */
#primaryNav li:hover, #primaryNav li.sfhover a { color: #5b8285; background-color: #FFFFFF; }
   /* L1 off states - for children */
#primaryNav li:hover li, #primaryNav li.sfhover li a { color: #777; }

   /* L2 on states */
#primaryNav li li:hover, #primaryNav li li.sfhover a { color: #000000; }
   /* L2 off states - for children */
#primaryNav li li:hover li, #primaryNav li li.sfhover li a { color: #777; }

   /* L3 on states */
#primaryNav li li li:hover, #primaryNav li li li.sfhover a { color: #FF3300; }
   /* L3 off states - for children */
#primaryNav li li li:hover li, #primaryNav li li li.sfhover li a { color: #777; }

   /* global states - bg colors */
#primaryNav li li:hover, #primaryNav li li.sfhover, #primaryNav li li li:hover, #primaryNav li li li.sfhover {
   background-color: #e1e8e9;
   }

/* DEFINE MENU APPEARANCE BEHAVIORS */
/* here we set the reveal/hide chains for the fly-out */
#primaryNav li:hover ul ul, #primaryNav li:hover ul ul ul {
   display: none;
   }
   
#primaryNav li:hover ul, #primaryNav li li:hover ul, #primaryNav li li li:hover ul {
   display: block;
   }

#primaryNav li.sfhover ul ul, #primaryNav li.sfhover ul ul ul, #primaryNav li li.sfhover ul ul {
   display: none;
   }
   
#primaryNav li.sfhover ul, #primaryNav li.sfhover ul, #primaryNav li li.sfhover ul, #primaryNav li li li.sfhover ul {
   display: block;
   }

hendrik · Post by **hendrik** » Fri 23. Jun 2006, 18:26

lburgess17 wrote:As I am working with this menu, is it possible to extend the functionality to the following:

1. the drop-down/popup menu for the level 2/3/4 items (which currently does),

2. but at the same time when OnHover, it could also change an image somwhere on the page?

see: http://meyerweb.com/eric/css/edge/popups/demo2.html for example.

Hi lburgess,

I tested my own advice

and found a problem with it, so maybe you are in pain now, so sorry for this:
see: http://www.hendrikschirmann.de/cms

the css part of importance is

Code: Select all

#primaryNav ul li a img {height: 0; width: 0; border-width: 0;}
#primaryNav a:hover img {position: absolute; top: 250px; left: 55px; height: 100px; width: 75px;}

The position of the pictures does change, because the position of the parent element (the li-tag) changes. The only solution for this I have in the moment is to have a fixed position for the images:

Code: Select all

#primaryNav a:hover img {position: fixed; top: 250px; left: 55px; height: 100px; width: 75px;}

But this is only "suboptimal" because 'position: fixed' is always relative to the upper left window corner.
Maybe I find a javascript solution...

Hendrik

fopulu · Post by **fopulu** » Tue 27. Jun 2006, 17:27

When I define the bg-colors of the submenus and at the filter opacity, only the first and the second level is shown. anybody an idea why?

Example:

/* DEFINE DEFAULT LI/A APPEARANCE */
/* here we set the standard LI states - controls bg color */
#primaryNav ul li { background-color: transparent; color: #666666; }
#primaryNav ul li li { background-color: #efefef; filter:alpha(opacity=60); color: #777; }
#primaryNav ul li li li { background-color: #ffffff; filter:alpha(opacity=60); color: #777; }
#primaryNav ul li li li li { background-color: #f9f9f9; filter:alpha(opacity=60); color: #777; }

Keppn · Post by **Keppn** » Tue 4. Jul 2006, 19:45

Hmm, after some hours of trying, i finally solved the problem ... although I don't really understand what the problem was. Quite frustrating, since the solution seemed just like a lucky guess

Anyway, now it works like a charm in IE and Firefox. Nontheless I would like to suggest to write additional comments in the css, so that other people using this great mod don't get caught in the same trap as me.

Timo S. · Post by **Timo S.** » Wed 5. Jul 2006, 18:11

Great RT! Exactly what i was looking for, but i encountered a small problem:

When i use:

Code: Select all

{DHTMLMENU:0,itemOff,itemOn}

all works fine! Now I need to hide the 1st level, because the site is a multilangual site. I tried it with:

Code: Select all

{DHTMLMENU:1,itemOff,itemOn}

but the result is, that nothing shows up anymore. The menu ist completly gone. If I re-insert a zero again,all fine! Can anyone help?

ps. I used the php, js and css from the first post.

thx for help!

hendrik · Post by **hendrik** » Wed 5. Jul 2006, 19:27

Now I need to hide the 1st level, because the site is a multilangual site. I tried it with:
Code: Select all
{DHTMLMENU:1,itemOff,itemOn}
but the result is, that nothing shows up anymore. The menu ist completly gone.

Do you have any subcategories to structure ID 1?

Hendrik

Timo S. · Post by **Timo S.** » Thu 6. Jul 2006, 06:46

Thx for trying to help!
Sure do I have substructures like this:

home

- english
- - sub1
- - - subsub1_1
- - - subsub1_2
- - sub2
- - - subsub2_1
- - - subsub2_2

- german
- - sub1
- - - subsub1_1

and so on.. thats what i got with a zero. the languages and on hovering the subs for each language...

hmmm i dont have a clue...

hmmm do iguess right: i need a structure with exactly ID:1 ?

edit: Okay! Thats the trick

there is no automatic level detection, the ID that works for me is ID:3 ^^

thanks for helping!!! problem solved!

Post by **flip-flop** » Thu 6. Jul 2006, 08:20

There is no trick, it is an ID based tag, not level based.

regards Knut