缩略图悬停时出现新图像

Question

Hey all, I'm trying to implement something where I have 2 thumbnail pictures underneath 1 large image. I would like the large image to change to another picture when you hover over the thumbnail. Is there a script, or tutorial out there for this? Possibly jquery?

Answer 1

jQuery would rock this. Here is a tutorial that does something similar. Good luck!

Answer 2

U can do it with hover function

CSS CODE:

.nav {
   background:url(images/3.png) no-repeat;
}

.nav_hover {
   background:url(images/4.png) no-repeat;
}

JQUERY CODE:

$('.nav').hover( 
function(){
   $(this).addClass('nav_hover');
}, 
function(){
   $(this).removeClass('nav_hover');
}
);

HTML Code:

// Call  class CSS Script to element

Check it