
Luego de las ya recomendadas Glossy.js 1.3 y Instant.js 1.0, veo en ajaxian que Christian Effenberger nos trae otro nuevo script con nuevo efecto para que utilices en tus sitios web. Curl.js esta vez nos permitirá agregarle a nuestras fotos un efecto de enrollamiento animado al pasar el mouse o fijo si lo desearamos asi, con lo que básicamente evitaremos tener que realizar este efecto de forma manual utilizando siempre un editor de imágenes.
Curl.js funciona muy bien con todos los navegadores “importantes” - Mozilla Firefox 1.5+, ópera 9+ y safari. Pero en IE viejos no se vera ninguna modificación, lo que nos es problema ya que los usuarios no notaran ninguna diferencia, simplemente verán la imagen de forma normal.
Instalación:
Primero descargamos la librería Curl.js y la alojamos en nuestro servidor.
Hacemos el llamado a la librería agregando en nuestro encabezado, antes de la etiqueta < / HEADER > lo siguiente:
NOTA: Verificamos bien en “src” que la localización del script sea la correcta.
Modo de uso:
Cuando deseamos usarla agregamos a nuestras imágenes la clase “curl”
EJ:

Otros Parámetros:
isize: nos permite variar del efecto el tamaño del enrollamiento, en caso de que deseamos hacerlo agregamos el parametro “ isize” seguido por el tamaño deseado en porcentaje: De forma default es 33.
Ej

icolor: Nos permite cambiar el color del enrollamiento que acompaña a la imagen. Lo hacemos agregando “ icolor” seguido por el color expresado en hexadecimal. minimo=000000 maximo=ffffff default=0
Ej:

Ishadow: nos permite variar la opacidad de la sombra. Para cambiarla lo haremos agregando la clase “ishadow” seguido por la opacidad en porcentaje:
minimo=0 max=100 default=66
Ej

Combinar mas de un parámetro a la vez:
En caso de desearlo así, podremos usar todos los parámetros a la misma vez.
Ej:

Con Animación
Si deseas flexibilidad, puedes utilizar “cvi_curl_lib.js” en vez de “curl.js”. Con ella puedes hacer que tus enrollamientos responden a las acciones del usuario (e.g. cambiando el tamaño del enrollamiento cuando se asoma la imagen encima). Demo

2 Comentarios por usuarios
gracias por los recursos,
Excelente gracias !!