Modern responsive Gallery/lightbox-WA MediaBox
| Autor: | jirihybek |
|---|---|
| Views Total: | 2,918 |
| Sitio oficial: | Ir a la web |
| Actualizado: | August 3, 2018 |
| Licencia: | MIT |
Vista prévia
Descripción
WA MediaBox es una biblioteca de JavaScript que muestra contenido HTML (imágenes, iframes, vídeos) en una ventana emergente de galería de estilo lightbox responsive, de pantalla completa, navegable.
¿Cómo funciona?
Cargue los archivos de JavaScript y StyleSheet de WA MediaBox en el documento HTML.
<link rel="stylesheet" href="dist/wa-mediabox.min.css"> <script src="dist/wa-mediabox.min.js"></script>
Añade imágenes, iframes de YouTube al lightbox de la Galería como sigue.
<div id="gallery"> <a href="1.jpg" data-mediabox="gallery-1" data-title="Image Caption 1"> <img src="thumb-1" alt="Image 1"> </a> <a href="https://www.youtube.com/embed/FA_8TY9Z5Zg?rel=0" data-mediabox="gallery-1" data-width="853" data-height="480" data-title="Sample video"> <img src="video-cover.jpg" alt="Video"> </a> </div>
Vincule el WA MediaBox al contenedor principal.
WAMediaBox.bindAll(document.querySelector("#gallery")); Cambiar el texto de los controles de la galería.
WAMediaBox.lang = {
prev: "Previous",
next: "Next",
close: "Close",
openInNew: "Open in new window"
}; Registro de cambios
08/03/2018
- Bugfix
