es.hideout-lastation.com
Paraíso Para Los Diseñadores Y Desarrolladores


15 bibliotecas de Lightbox para la receptividad móvil

Lightbox es una forma popular de superponer imágenes en la web . Cuando hace clic en una imagen, Lightbox aparece con alguna forma de animación y atenúa el fondo para que se centre en la imagen misma. La imagen también es más grande en escala. La mayoría de las bibliotecas de Lightbox JavaScript populares que hemos conocido durante años le permiten hacerlo bien en el escritorio, pero no tanto en las plataformas móviles.

Descuidar esto, y la necesidad de capacidad de respuesta, no es una buena idea hoy en día, por lo que esta colección de 15 bibliotecas de Lightbox receptivas debe ser revisada.

Más sobre Hongkiat:

  • Crear una ventana modal fácilmente con el cuadro de diálogo HTML5
  • Las 10 mejores galerías de imágenes / presentaciones responsivas gratis
  • Crear, controlar y personalizar una mejor ventana modal para su sitio usando Vex
  • Galerías de imágenes jQuery y controles deslizantes - Best Of

PhotoSwipe

PhotoSwipe es, de lejos, mi plugin ligthbox favorito. Es ligero, táctil y, lo que es más importante, modular, lo que me permite eliminar algunas partes que no son necesarias. Se ejecuta muy bien en navegadores móviles. Puede pasar las imágenes con los dedos como lo haría en una aplicación nativa, y la transición se ejecuta sin problemas.

  • Dependencia : ninguna
  • Compatibilidad con el navegador : IE8 +, Chrome, Firefox, Safari, Opera y un par de navegadores móviles.
  • Licencia : licencia de MIT

MagnificPopup

MagnificPopup es otro complemento lightbox, desarrollado por la misma persona que nos dio PhotoSwipe, Dmitry Semenov. Viene en forma de un plugin jQuery / Zepto, y también trae capacidades que faltan en PhotoSwipe, como soporte para video, mapa y contenido de Ajax. Esta es una gran alternativa para aquellos que prefieren tener más funciones a mano.

  • Dependencia : jQuery 1.9.1+ o Zepto.js
  • Compatibilidad con el navegador : IE7 (parcialmente), IE8 +, Chrome, Firefox, Safari y Opera.
  • Licencia : licencia de MIT

SwipeBox

Swipebox es un complemento jQuery con soporte de gestos táctiles para la plataforma móvil. También es compatible con videos de Youtube y Vimeo además de imágenes. Swipebox también es francamente fácil de implementar y tiene varias opciones para personalizar su comportamiento. Creo que Swipebox es un excelente complemento de lightbox para noobs de JavaScript.

  • Dependencia : jQuery
  • Compatibilidad con el navegador : IE9 +, Chrome, Safari, Firefox, Opera, iOS 4 +, Android y Windows Phone.
  • Licencia : Indefinida

iLightbox

iLighbox es un plugin jQuery lightbox con una amplia gama de soporte de tipos de medios: incluyendo videos, Flash / SWF, contenido Ajax, iframe y mapas. Este complemento también agrega botones de redes sociales en la parte superior de los medios, lo que permite a los usuarios compartirlo en Facebook, Twitter o Reddit. También consulte la sección avanzada para ver cómo se puede aplicar iLightbox en diferentes escenarios.

  • Dependencia : jQuery
  • Compatibilidad con el navegador : IE7 +, Chrome, Firefox, Safari y Opera
  • Licencia : Indefinida

Lightbox para Bootstrap

Lightbox es una de las piezas que faltan de Bootstrap. Este complemento corrige eso. Si está utilizando Bootstrap, le recomiendo usar esta biblioteca. El complemento está bien integrado con la base de código de Bootstrap.

  • Dependencia : jQuery y Bootstrap Modal
  • Compatibilidad con el navegador : IE8 +, Chrome, Firefox, Safari y Opera
  • Licencia : licencia de GNU

Nivo Lightbox

Nivo Lightbox es un complemento de lightbox flexible. Se incluyen varias opciones para cambiar la apariencia de la manera que le gustaría que aparezca, como cambiar el tema, el efecto de transición y cambiar la navegación.

  • Dependencia : jQuery
  • Compatibilidad con el navegador : IE9 +, Chrome, Firefox, Safari y Opera
  • Licencia : licencia de MIT

ImageLightbox

ImageLightbox es un complemento lightbox sin la hinchazón. Está diseñado especialmente para la imagen, de ahí el nombre dado: no se admiten videos u otros tipos de medios. Tampoco requiere marcado HTML extraño; el elemento es suficiente. El plugin simplemente funciona.

  • Dependencia : jQuery
  • Compatibilidad con el navegador : IE9 +, Chrome, Firefox, Safari y Opera
  • Licencia : Indefinida

Mini Lightbox

Otro complemento lightbox con nada de la hinchazón. La biblioteca tiene solo 2kb y solo funciona con imágenes. Es el complemento perfecto si solo designa el último navegador y no necesita superponer otros tipos de medios, como los videos.

  • Dependencia : ninguna
  • Compatibilidad con el navegador : IE10 +, Chrome, Firefox, Safari y Opera
  • Licencia : licencia de MIT

LightCase

Lightcase es un encantador plugin lightbox. Viene con varias animaciones que hacen que la interacción del usuario cobre vida, como el desvanecimiento, el zoom elástico y el desplazamiento. Además, también es compatible con varios tipos de medios, incluidos los de inserción de Youtube, HTML, SWF y formularios de entrada. El complemento también maneja correctamente los medios de comunicación. No se puede alcanzar ni encontrar errores.

  • Dependencia : jQuery
  • Compatibilidad con el navegador : IE9 +, Chrome, Firefox, Safari y Opera
  • Licencia : licencia GPL

Yalb

Yalb significa Yet Another Lightbox, pero no lo es. Yalb viene con un puñado de API que incluyen eventos personalizados que le permiten identificar estados de lightbox, como cuando está open y cuando está close . Yalb viene en dos versiones, Vanilla JavaScript y jQuery.

  • Dependencia : ninguna
  • Compatibilidad con el navegador : IE9 +, Chrome, Firefox, Safari y Opera
  • Licencia : licencia de MIT

Ligero como una pluma

El Featherlight de 6kb es un complemento simple para el desarrollador inteligente y solo incluye lo esencial. Si necesita, por ejemplo, agrupar lightbox de imagen en una galería, puede incluir la extensión de galería. También puede desarrollar su propia extensión para este complemento que se ajuste a las necesidades de su proyecto.

  • Dependencia : jQuery
  • Compatibilidad con el navegador : IE8 +, Chrome, Firefox, Safari y Opera
  • Licencia : licencia de MIT

LightLayer

LightLayer es un plugin lightbox fácil de usar. Tiene un puñado de opciones, métodos de JavaScript personalizados y eventos personalizados. el complemento funciona con imágenes, videos, mapas y contenido externo. Lo que es más, podemos preguntar.

  • Dependencia : jQuery
  • Compatibilidad con el navegador : IE9 +, Chrome, Firefox, Safari y Opera
  • Licencia : licencia de MIT

LightGallery

LightGallery, otro complemento lightbox con muchas funciones añadidas. Viene con más de 20 opciones para personalizar los detalles más pequeños de la caja de luz.

  • Dependencia : jQuery
  • Compatibilidad con el navegador : IE7 +, Chrome, Firefox, Safari, Opera, iOS, Android y Windows Phone
  • Licencia : licencia de MIT

FluidBox

Fluidbox es un complemento de lightbox de imagen inspirado en Medium. Funciona con imágenes en diversas circunstancias, incluida la imagen flotante, la imagen con posición absolute, las imágenes que tienen borde y relleno, y las galerías. Mira cómo fue construido. Si necesita un complemento de WordPress, hay uno.

  • Dependencia : jQuery
  • Compatibilidad con el navegador : IE9 +, Chrome, Firefox, Safari, Opera
  • Licencia : licencia de MIT

StripJS

StripJS es un plugin lightbox único. En lugar de superponer la imagen, el complemento desliza las imágenes desde un lado, para que no bloquee todo el contenido. StripJS admite imágenes y videos.

  • Dependencia : jQuery
  • Compatibilidad con el navegador : IE7 +, Chrome, Firefox, Safari, Opera, iOS 5+ y Android 3+
  • Licencia : licencia Creative Commons BY-NC-ND 3.0

Crear widgets con pestañas receptivas con GridTab

Crear widgets con pestañas receptivas con GridTab

Siempre es más fácil crear sitios web utilizando herramientas de código abierto en lugar de reinventar la rueda. Estas herramientas van desde bibliotecas hasta complementos más pequeños, pero puede encontrar una solución para prácticamente cualquier cosa.El fenomenal plugin jQuery GridTab es un buen ejemplo. Le pe

(Consejos de tecnología y diseño)

Imagen de carruseles en diseño web: beneficios y mejores prácticas

Imagen de carruseles en diseño web: beneficios y mejores prácticas

No hay escasez de presentaciones de carrusel en la web. De hecho, esta tendencia no ha hecho más que crecer en los últimos 5-10 años con más soporte para navegadores ahora que nunca. Pero, ¿los carruseles de imágenes realmente valen la pena? ¿Qué tipo de beneficios producen, y cómo deben usarse productivamente en un diseño?Me gustar

(Consejos de tecnología y diseño)