CSS or javascript image gallery

and change background image on hover

[leebee]

I am currently making a website for my friend who is a photographer, and he wants the background image to change when you hover over the link but change back or to another when the mouse is moved.

I know i have to use a:hover but not sure what else.

Also when you do click on the link, he wants the image to stay as the background and two buttons appear, to move forwards and backwards through the images, would i have to use java here as i dont want to use flash.

Any help would be amazing

thanks

[alt131]

Hi Leebee, and welcome to WebmasterWorld :)

he wants the background image to change when you hover over the link but change back or to another when the mouse is moved.

Yes, you are right you need hover, although whether it is on the <a> depends on the browser/versions you are supporting. Changing to a third image on mouse-out could be tricky, but w3schools has tutorials that explain the basics of background images [w3schools.com] and Links [w3schools.com] you can combine to try the effect.

... he wants the image to stay as the background and two buttons appear, to move forwards and backwards through the images ...

I wonder if you would find it easier to use javascript for this as there are lots of pre-made scripts available. Try a search on "javascript image gallery" or similar. You might also want to consider a "light-box" which is slightly different, but might be interesting too.