3 replies [Last post]
jduffell
jduffell's picture
Offline
Regular
Preston, Uk
Last seen: 9 years 15 weeks ago
Preston, Uk
Timezone: GMT+1
Joined: 2007-06-15
Posts: 43
Points: 21

Hi i'm trying to build a portfolio site for a friend, and he's requested that there are 5 vertical images all in a row, and when each of the images is hovered upon the image jumps up a few pixels, is this possible using css ?

I've seen it done before where an image is used, and half of it is cropped and then it shifts up when the cursor is positioned over it, however he has just requested that the image moves upwards slightly.

Anyway any help would be much appreciated thanks :rolleyes:

amadika
amadika's picture
Offline
Enthusiast
Texas
Last seen: 10 years 40 weeks ago
Texas
Timezone: GMT-6
Joined: 2007-04-16
Posts: 206
Points: 4

If you make the links

If you make the links images, this is easily accomplished by simply changing their position a little in photoshop.

This is basically how you do an image rollover with css:
http://www.findmotive.com/2006/10/31/simple-css-image-rollover/

or

http://www.annedorko.com/webdesignblog/css-tutorial-how-to-create-css-image-rollovers-with-a-single-background-image

When you make the image, just up the text (or whatever) up a few pixels, and it will create the illusion of it jumping up.

@}->-- Amanda

jduffell
jduffell's picture
Offline
Regular
Preston, Uk
Last seen: 9 years 15 weeks ago
Preston, Uk
Timezone: GMT+1
Joined: 2007-06-15
Posts: 43
Points: 21

Thanks

Wooo it works thanks Amanda Smile

amadika
amadika's picture
Offline
Enthusiast
Texas
Last seen: 10 years 40 weeks ago
Texas
Timezone: GMT-6
Joined: 2007-04-16
Posts: 206
Points: 4

Glad to hear it And glad I

Glad to hear it Smile And glad I could help!

@}->-- Amanda