http://www.grupokumiko.com/generales/EfectoCarruselyVentanaFlotante.html
Como hacer el…
zoom en imágenes
y ventana flotante.
Es cierto que siempre queremos darle vida a nuestra web usando imágenes, algunos usamos animadas y otros animaciones Flash que suelen ser pesadas ahora con jQuery tenemos la solución y facilmente…
Para que mande a llamar los archivos CSS y JS, colocala entre las etiquetas <head> y </head> .
<script type=»text/javascript» src=»jquery.js»></script>
<script type=»text/javascript» src=»thickbox.js»></script>
<link rel=»stylesheet» href=»thickbox.css» type=»text/css» />
Al menos este script necesita colocarlo entre dichas etiquetas <div>, recuerda colocar la imagenes dentro de la carpeta «images«.
<div id=»containerEx2″>
<div id=»ex2″>
<a href=»fondo (4).jpg» class=»thickbox» title=»Ejemplo ThickBox»>
<img src=»fondo (4)Chica.jpg» width=»150″ height=»120″ /></a> <a href=»fondo (10).jpg» class=»thickbox» title=»Ejemplo ThickBox»>
<a href=»fondo (18).jpg» class=»thickbox» title=»Ejemplo ThickBox»>
<img src=»fondo (18)Chica.jpg» width=»150″ height=»120″ /></a> </div></div>
#containerEx2 {
clear: both;
width: 150px;
margin: 0 auto;
min-height: 120px;
}
#ex2 img{
height: 120px;
width: 150px;
margin: 15px 0;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
} #ex2 img:hover {
height: 130px;
width: 165px;
margin-left: 0px;
}
Descarga el archivo pues aqui estan los «js» que necesitas para que funcione el efecto, descomprimelo y editalo a tu gusto:
«« wWw.GrUpOkUmIkO.cOm »» 