Ampliar imagen usando jQuery

jQuery Image Magnify es un script vía Dynamic Drive que nos permite ampliar -amplificar, pasar de una previa pequeña a su tamaño original- cualquier imagen, cuando le damos clic aplica un efecto de transparencia mientras la imagen va tomando su tamaño normal en el centro de la pantalla, al hacer clic en la imagen vuelve a su tamaño anterior. En otras palabras un efecto zoom in/out haciendo uso de jQuery.

jquery image magnifi

Uso

Especificar la clase para las imágenes que harán uso del script:

<img src="ocean.gif" 
class="magnify"
style="width:200px; height:150px" />

<img src="forest.gif"
class="magnify"
border="0" />

Bastará con especificar algunos valores de configuración al archivo jquery.imageWarp.js:

dsettings: {
magnifyby: 3, //incremento de imagen
duration: 500, //duracion de animacion, milisegundos
mgopacity: 0.2 //transparencia mientras imagen toma su tamaño normal
},

cursorcss: 'url(magnify.cur), -moz-zoom-in',

Funca sobre Firefox 1+, IE 6+, Opera 9+

Vía BitRepository 

4 thoughts on “Ampliar imagen usando jQuery

Leave a Reply

Your email address will not be published. Required fields are marked *

Proudly powered by WordPress | Theme: Wanderz Blog by Crimson Themes.