Welcome to WebmasterWorld Guest from 54.167.110.211

Forum Moderators: not2easy

Message Too Old, No Replies

CSS or javascript image gallery

and change background image on hover

     
8:35 pm on May 30, 2011 (gmt 0)

New User

joined:May 30, 2011
posts:1
votes: 0


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
8:13 pm on June 1, 2011 (gmt 0)

Senior Member

WebmasterWorld Senior Member 5+ Year Member

joined:Aug 9, 2008
posts: 961
votes: 0


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.
 

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

Featured Threads

Free SEO Tools

Hire Expert Members