Efecto Zoom en Home Featured (con JQuery)

[ErikSebastia2]

Hola compañeros,

 

Quiero conseguir un modulo (preferiblemente gratuito) que me consiga un efecto de Zoom en el Home Featured como la siguiente pagina (cuando pasais el cursor por encima d eun producto).

 

http://www.unpublished.it/templates/prestashop/hoverstyle-we/

 

Gracias

[ErikSebastia2]

Algún módulo con el que pueda ahcer este efecto?

 

Saludos

[yesiam]

$(document).ready(function(){

$("#featured-revolt li,ul#product_list li").hover(function() {

$(this).css({'z-index' : '9999'});

$(this).find('div').addClass("hover").stop()

.animate({

marginTop: '-175px',

marginLeft: '-152px',

top: '50%',

left: '50%',

width: '300px',

height: '340px',

padding: '0px'

}, 500);

} , function() {

$(this).css({'z-index' : '0'});

$(this).find('div').removeClass("hover").stop()

.animate({

marginTop: '0',

marginLeft: '0',

top: '0',

left: '0',

width: '225px',

height: '225px',

padding: '0'

}, 400);

});

});

Eso lo que hace es ampliar el div que contiene esa imagen eso es todo, revisa el codigo fuente de esa web y veras como funciona, muy sencillo de hacer aunque yo no lo usaria ya que tienes que cargar la imagen a gran tamaño para que al ampliar el div se vea la imagen completa, lo que quiere decir que recargas la pagina en peso y a mas pesa mas tarda en cargar, etc....., pero se hace como te dije, ese es el js de esa web, saludos.