CSS menu, how should I go about this...

Ok, so I want to have a menu that occupies the same space

ie:

Main links
-------------------------------------------------
| Home | Services | Contact | etc |
-------------------------------------------------

When user mouse overs say "Services":
-------------------------------------------------
| Home | Services | Contact | etc |
-------------------------------------------------
|What we do | How we do it |
----------------------------

But if they mouse over Contact
-------------------------------------------------
| Home | Services | Contact | etc |
-------------------------------------------------
|Email us| fill out form|
--------------------

I got this working by just using <div id="subMenu"><div> and then with javascript putting the content in there, but I'm affraid that search engines will not find those links in the subMenu because they are written up in the javascript code.

Any suggestions?

I then did layers, and made them hidden/visible with javascript, but in Netscape the layers all seem to be 10px down to far...

Is there a "right" way to go about this?

See if this doesnt help inspire you in some manner:

http://www.gazingus.org/html/Using_...HTML_Menus.html