Spec me a Tutorial

Atomic

Atomic

Atomic

Associate
Joined
27 Jan 2005
Posts
830
I'm in need of a tutorial site.

I want to create a horizontal nav bar for my site obviously with CSS.

I have created the nav bar and will have 4 sections to it 'Home', 'Services', 'Location' and 'Contact Us'. However, I want it to have around 4 rollover states and the text to be created in photoshop and "stuck" to the nav bar image.

Basically it's a bit like the Apple website.

I have already position all bars into one .png image, but getting stuck on how to implement it into the website.
 
If you want it like the apple site you'd probably want an unordered list to style. The best way to create rollover images is to have the normal state and the rollover state in one image side by side. Then when you rollover the css shifts the image (which will be the background image) horizontally and it means there's no flicker while waiting for the second image to load because it already has been.

There are loads of tuts on how to do it, here's just one I found quickly.

http://www.wellstyled.com/css-nopreload-rollovers.html
 
You must log in or register to reply here.
Back
Top Bottom