BLOG DE DISEÑO WEB CORUÑA

Un poco de todo, recursos, tutoriales, noticias, anuncios...

Magnific Popup, lightbox bonito, responsive, liviano y para jQuery

10/ENE/2014 35.465 visitas Ver comentarios
Magnific Popup, lightbox bonito, responsive, liviano y para jQuery

ADVERTENCIA: Este artículo tiene más de 6 meses de antigüedad. Puede que esta información ya se encuentre obsoleta o haya nuevas y mejores opciones.

Siempre que debo utilizar algún sistema para lanzar un popup, me suelo decantar por Colorbox, un plugin muy liviano pero inmensamente potente para lanzar popups bonitos (de esos que no abren una nueva ventana sino que oscurecen la actual y muestran el nuevo contenido en primer plano).

Muchas veces queremos abrir formularios, mensajes, alertas, ampliar fotografías, textos adicionales o cualquier otro contenido y estos popups son una muy buena solución.

Actualmente, hay pocos que estén preparados para ser responsives, es decir que puedan adaptarse al tamaño de tu pantalla sin parámetros o configuraciones extra.

Sin ir más lejos, colorbox tiene algunos parámetros para simular su adaptación como el ancho y alto máximos pero, y a pesar de que existe hace tiempo, he descubierto Magnific Popup.

Magnific Popup es un sistema de diálogos, popup (lightbox) responsive que está centrado en el rendimiento (su estética es un tanto simple pero no deja de ser bonita), adaptando el tamaño de las fotografías o ventanas automáticamente al tamaño del viewport.

Además de soportar imágenes, galería de imágenes, precarga de imágenes, vídeos de youtube o vimeo, mapas de Google Maps, contenido inline o cargado remotamente por ajax admite también ventanas modales. Incluso dispone de una versión en forma de plugin para Wordpress.

Su principal desventaja es que no soporta IE6 y tiene soporte parcial en IE7 (aunque colorbox soporta desde IE7 en adelante).

Otros sistemas de lightbox potentes (quiero decir que abran más que simples imágenes) son:

Si conoces más y quieres compartirlos, aquí abajo tienes los comentarios.

Acerca del Autor...

Macadia, es una agencia de Diseño Web Coruña, especializada en maquetación css y desarrollo de páginas web a medida con más de 21 años de experiencia en el desarrollo de páginas web profesionales. Si te ha gustado este artículo, por favor, ayúdanos a difundirlo compartiéndolo con tus amigos y contactos en las distintas redes sociales que utilices. ¡Muchas gracias!

Los comentarios han sido desactivados momentaneamente a la espera de que Disqus adapte su plataforma a la próxima RGPD que entra en vigor desde el 25/05/2018