PDA

View Full Version : Glossy Accordion Menu - submenu not showing



tbsg
11-04-2008, 08:14 PM
1) Script Title: Glossy Accordion Menu script
2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...enu-glossy.htm

3) Describe problem: I've installed this script on a few sites and haven't had any issues with it before. Now I've installed it on a new site we're developing and for some reason I can't get the submenu to be visible. Here's the link to the development site http://www.cmswebsolutions2.com/eco. The expand/collapse works and the you can click on the links in the submenu but you just can't see them. I've tried using the styles from the sample and it doesn't help either.

html:


<div class="glossymenu">
<a class="menuitem active" href="index.php">Home</a>
<a class="menuitem" href="about-ecobusiness.php">About EcoBusiness</a>
<a class="menuitem" href="business-stories.php">Business Stories</a>
<a class="menuitem" href="joining.php">Joining</a>
<a class="menuitem" href="events-workshops.php">Events &amp; Workshops</a>
<a class="menuitem" href="sponsors.php">Sponsors</a>
<a class="menuitem" href="web-links.php">Web Links</a>
<a class="menuitem submenuheader" href="#">Tools &amp; Resources</a>
<div class="submenu">
<ul>
<li><a href="lunch-learn.php"></a></li>
<li><a href="checklists.php"></a></li>
<li><a href="financial-incentives.php"></a></li>
<li><a href="green-pages.php"></a></li>
</ul>
</div>
<a class="menuitem" href="library.php">Library</a>
<a class="menuitem" href="contact.php">Contact Us</a>
</div>


css:


/* accordion menu */
.glossymenu {
padding: 0;
width: 158px; /*width of menu*/
}
.glossymenu a.menuitem {
color: #FFF;
display: block;
position: relative; /*To help in the anchoring of the ".statusicon" icon image*/
width: auto;
padding: 4px 0;
padding-left: 10px;
text-decoration: none;
}
.glossymenu a.menuitem:visited, .glossymenu .menuitem:active{
color: #FFF;
}
.glossymenu a.menuitem .statusicon{ /*CSS for icon image that gets dynamically added to headers*/
position: absolute;
top: 5px;
right: 3px;
border: none;
}
.glossymenu a.menuitem:hover{
background: #458C31;
}
.glossymenu div.submenu{ /*DIV that contains each sub menu*/
background: #FFF;
}
.glossymenu div.submenu ul{ /*UL of each sub menu*/
list-style-type: none;
margin: 0;
padding: 0;
}
.glossymenu div.submenu ul li{
color: #458C31;
border-bottom: 1px dotted #458C31;
}
.glossymenu div.submenu ul li a{
display: block;
color: #458C31;
text-decoration: none;
padding: 2px 0;
}
.glossymenu div.submenu ul li a:hover{
background: #458C31;
color: #FFF;
}


Any idea what might be going on? It's a mystery to me.

ddadmin
11-05-2008, 12:20 AM
Well, looking at your sub menu links, they are empty:


<div class="submenu">
<ul>
<li><a href="lunch-learn.php"></a></li>
<li><a href="checklists.php"></a></li>
<li><a href="financial-incentives.php"></a></li>

<li><a href="green-pages.php"></a></li>
</ul>
</div>

That's probably it. :)

BTW, please note that your page is currently in violation of our usage terms, since the credit notice doesn't appear inline on the page. Please reinstate the credit notice: http://www.dynamicdrive.com/notice.htm

tbsg
11-05-2008, 12:56 PM
well, that's slightly embarassing :o

btw, the notice is in the file. i didn't copy it in to my post but it's definitely there.

thanks again!!