Drop Down Menu Question

I created a header in photoshop and I also created a horizontal menu within said header. I would like this menu to have the common drop down functionality on mouse rollover as we see so often. Can someone tell me how I might go about this. e.g. do i have to import it into to Flash? etc. The tools I have at my disposal are flash, dreamweaver, and photoshop. Thanks.

Attached Images

tanHeader2.jpg (17.3 KB, 57 views)

this can be done with css, have a look here http://css.maxdesign.com.au/listamatic/

__________________
My Recipe forum... For all your food needs

There is a horizontal option to this one as well. http://www.tanfa.co.uk/css/examples/...rial-v.asp#vs4

I actually had good luck with this one today.

Go check out the css forum. There is a tutorial in the sticky at the top of the forum on how to do this. It explains vertical and horizontal menus.

I worked through the one in the sticky and had good luck with that also!

I thank you guys for your directions and links. I look forward to burying my nose in CSS. Before I do so I just want to be sure of one thing. I just want to be sure that you guys clicked on the thumbnail sample that I attached with the post and that you understand it's all part of the photoshop gif header image. I ask this because everything that I've seen thus far of css seems to be creating the menu in css directly. It's not clear to me how css plays into creating drop down functionality on a gif created in photoshop. Maybe absolute positioning is the key. I don't know. Thanks!!!

It's going to be exactly the same. When you style your menu you'll end up having something like this for a horizontal menu...

Code: Select all

div#navigation li a {
   background: #fff url(/images/menupic.gif) repeat-x;
   color: #000;
}

div#navigation li a:hover {
   background: #ff0 url(/images/menuhover.gif) repeat-x;
   color: #fff;
}

This code will make the background of your links into images (menupic & menuhover in this example) that are repeated horizontally or across the x-axis.

Take a look at this page that I wrote the css for the menu system. It doesn't have drop downs but it does have an image as a background...

http://ldstroop21.org

Yes CSS should do what you want, but look at what BGarner said about images, as in all the components should have their own regular and rollover gif that switch back and forth. I hope I said that right because I'm not really thinking straight right now...

Two questions:
- Do I need to go back and recreate the menu portion of my header with the purpose of individualizing the menu items so that they each have their own list item id? This is for both the original and the hover image.

- I have this thought that I need to create a horizontal menu with css that's the same size as the menu and then superimpose it over top the actual menu and make the background transparent and indent the text -9999 so that it isn't visible. Am I off base with the whole superimpose thing?

Thanks tremendously!!! I really appreciate the help. I have been at this for 3 or 4 days now and it's kicking my butt. Had I not created this header image this would be much easier but I'm determined to see it through.

You may need to crop the menu from the header and use separate components for the menu. Try it out, and see what happens.

Got a better solution for the hover image change. Background switch is the ultimate!

http://www.newguyinennis.com/samples/css_hover/