Processamentix

Temos nesse esquema, uma imagem principal e alguns thumbnails, onde, ao passar o mouse por cima dos thumbs, a imagem principal muda para a imagem que é apontada pelos thumbs. Assim, temos por exemplo, o html com as imagens Um css básico #main-img { width: 200px; height: 300px; overflow:hidden; } #main-img img { width: 200px; } #thumb-img { width: 200px; } #thumb-img li { margin-right: 20px; display:inline; width: 50px; height: 50px; height-overflow: hidden; } #thumb-img img { width: 50px; } O javascript então , para ter o nosso efeito será $(document).ready( function(){ $("#thumb-img img").hover( function(){ /* Pega o nome da imagem do thumbnail */ var thumbsrc = $(this).attr('src'); /* Substitue a imagem principal pela imagem do thumbnail */ $("#main-img img").attr('src',thumbsrc); }); }); devidamente colocado num script a parte ou no inicio da página junto com a versão mais atual do jquery