Hi, I don't know if this is even possible or not, but I am trying to get Sons of Suckerfish to work for this main navigation: http://www.legacymultimedia.com

If you notice when you hover over the Services link, some horizontal sub-menu items show up, which is somehow controlled by Javascript from the designer who worked on this site before I came along.

So, I've come along and really cleaned up the code a ton, removing nested tables and turning the main navigation into one image, using the Matrix Navigation technique, where you use one image for the navigation, and then use background positioning in CSS for the hover and on state. Very clever indeed...

Here is the link to the newly marked up page: http://www.legacymultimedia.com/index-new.html

However, I can't get the horizontal sub-menu items (which are just text) to drop down horizontally. I've told that I need to have Sons of Suckerfish implemented to allow that text to come down below the main navigation, but I'm not sure if you can do it with the Matrix Navigation technique that I've set up.

Anyways, any help would greatly be appreciated on this...

Thanks,
Spencer
http://barefoot-webdesign.com

Spencer,

The XHTML needs some adjusting. The secondary (hover) navigation needs to be nested within the primary navigation. It should look something like this:

<ul id="nav">
<li><a href="#">About Legacy</a></li>
<li><a href="#">Services</a>
<ul>
<li><a href="#">Custom DVD Packages</a></li>
<li><a href="#">Milestone DVDs</a></li>
<li><a href="#">etc.</a></li>
</ul>
</li>
<li><a href="#">Portfolio</a></li>
<li><a href="#">etc.</a></li>
</ul>

You then use the CSS to hide the interior list (display: none), and then show the interior list on rollover (display: block). There are a TON of good examples of this if you Google it. Or just use the original SoS example. You'll need some JS to get the hover effect to work in IE6.