Single Vertical image rollover

[Slimsteve]

Does anyone know if it is possible in css to use a single image as the background for a vertical rollover menu.

To give you an idea of the image I have been asked to used see here

http://stormdevelopment.co.uk/navigationrollover.gif.

The top half is the normal menu links and when the user hovers over a link I need to show the relevant area in the bottom half of the image.


Thanks

Slim

 

[lynque]

Rounded corners are what makes this tricky - you will have to use 3 different images as the background image in your .css.

Give the top item in the dropdown list the background of topround.gif (or whatever you call it)

The middle item(s) middle.gif

The bottom item botround.gif

Try that - should work ;-)

 

[FesterSXS]

If I were you I would get rid of the images and use text instead. With a little CSS you can make your text links look just like the example you have provided.

The main benefits of doing it this way:
- Search Engine friendly text links
- a more accessible menu for non-graphical browsers
- MUCH easier to update with new/modified links

Tony

Spirax-Sarco - steam traps control valves heat exchangers
Sun Villa - Luxury Florida accommodation

 

[Slimsteve]

Thanks everyone, I agree with your comments.

I didn't consider the search engine and accessibilty stuff, I will be using the good old hyperlinks with css to provide link rollover colours.

Slim