Morton 20 de noviembre de 2010 a las 09.03
   Imprimir artículo
elWebmaster.com

Mootols: Ventanas al estilo Facebook en tu sitio web con LightFace


mootoolswideCuando navegamos en Facebook solemos interactuar con varias ventanas emergentes dentro del sitio, las cuales no poseen sombreado, animaciones para redimensionarse, ni nada, sino que conservan un estilo minimalista. También puedes tenerlas en tu sitio web, con la ayuda de LightFace.

Fuente original del artículo: David Walsh Blog
Traducción realizada por
elWebmaster.com

Creado por David Walsh, este componente web para Mootols logra emular toda la estética de las ventanas, cuadros de diálogo y gráficos de carga de Facebook imitando su tradicional estilo.

Haz clic aquí para ver una demostración de LightFace >>

Haz clic aquí para descargar LightFace >>

lightface3

LightFace cuenta con:

  • Cinco clases compactas: LightFace, LightFace.Request, LightFace.IFrame, LightFace.Image, and LightFace.Static
  • Reduce las imagenes al redimensionar la ventana
  • Provee varias opciones para personalizar cada instancia
  • Responde a eventos de teclado designados
  • Utiliza la clase Drag de Mootols More para crear la ventana móvil (Drag no está incluido en el repositorio)
  • Puedes añadir cuantos botones quieras
  • Agrega y quita eventos según sean necesarios para una mejor estabilidad del navegador

Soporta IE6+, Safari, Chrome, Opera, y finalmente iPad/iPhone. Provee una gran flexibilidad a la hora de ser personalizado.
David Walsh sigue actualizando su herramienta que pronto incorporará, por ejemplo, etiquetado de fotos.

Haz clic aquí para ver una demostración de LightFace >>

Haz clic aquí para descargar LightFace >>

Fuente original del artículo: David Walsh Blog
Traducción realizada por
elWebmaster.com


Enviar a Del.icio.us Enviar a Meneame Enviar a Digg Enviar a Fresqui Enviar a Enchilame

Comentarios (2)

  1. links for 2010-11-24 | Tombola! dice:

    […] Mootols: Ventanas al estilo Facebook en tu sitio web con LightFace – elWebmaster.com (tags: mootools) […]

  2. Esteban dice:

    Que tal.. una pregunta. ¿Cómo hago para que la ventana sea redimensionable?, lo unico que puedo hacer es que se mueva dentro de la pagina: con “draggable: true”, pero quiero poderla hacer mas pequeña o mas grande, y no se como.. espero que me puedan ayudar

Deja tu opinión

© 2007 - 2008 elWebmaster.com | Powered by Wordpress | Diseño CSS y XHTML válido. | Algunos íconos basados en FamFamFam Mini
Acceder