Galería de imágenes de pantalla completa JavaScript puro con navegación en miniatura
| Autor: | danrnascimento |
|---|---|
| Views Total: | 3,740 |
| Sitio oficial: | Ir a la web |
| Actualizado: | March 30, 2017 |
| Licencia: | MIT |
Vista prévia
Descripción
Una galería/visor de imágenes de pantalla completa con capacidad de respuesta, con navegación en miniatura, compilación con JavaScript puro y CSS. Los usuarios pueden alternar entre las imágenes haciendo clic en los enlaces siguiente/anterior y/o en las imágenes en miniatura.
Funcionamiento
Cargue los siguientes archivos JavaScript y CSS en el documento HTML.
<link rel="stylesheet" href="index.css"> <script src="index.js"></script>
Inserte las imágenes junto con los vínculos de navegación siguiente y anterior int el documento.
<div class="carousel-container"> <img src="1.jpg" alt="" class="current-image"> <span class="arrow arrow-left"> Prev </span> <ul class="next-list"> <li><img src="2.jpg" alt="" class="image-of-list current-image-list"></li> <li><img src="3.jpg" alt="" class="image-of-list"></li> <li><img src="4.jpg" alt="" class="image-of-list"></li> <li><img src="5.jpg" alt="" class="image-of-list"></li> </ul> <span class="arrow arrow-right"> Next </span> </div>
