Biblioteca de carrusel versátil y adaptable para imágenes-Sebastian Carousel
| Autor: | SebasWebDev |
|---|---|
| Views Total: | 1,222 |
| Sitio oficial: | Ir a la web |
| Actualizado: | August 10, 2018 |
| Licencia: | MIT |
Vista prévia
Descripción
Sebastian Carousel es una librería JavaScript de carrusel simple, ágil, flexible y rica en características diseñada para mostrar tus imágenes de forma sencilla.
Funcionamiento
Inserte la hoja de estilos ' Sebastian-Carousel. css ' y JavaScript ' Sebastian-Carousel. js ' en su documento HTML.
<link href="css/sebastian-carousel.css" rel="stylesheet"> <script src="js/sebastian-carousel.js"></script>
Añade tus imágenes al carrusel y configuración de la biblioteca de Sebastian Carousel usando los siguientes atributos de ' datos ':
- Data-SC: requerido
- Data-SC-Theme: ' fullwidth ', ' contenido-oscuro ', ' contenido-luz ', ' social ', ' editorial
- Data-SC-AutoStart: si se inicia la reproducción automática en la carga de la página
- Data-SC-paginación: si Mostrar la paginación por secuencia
- Data-SC-showArrows: si Mostrar la navegación por secuencia
- Data-SC-Interval: intervalo de reproducción automática en milisegundos
- Data-SC-efecto: ' fade ' o ' Slide '
<div id="demo" data-sc data-sc-theme="fullwidth" data-sc-autostart="true"> <div> <img src="1.jpg"> </div> <div> <img src="2.jpg"> </div> <div> <img src="3.jpg"> </div> <div> <img src="4.jpg"> </div> <div> <img src="5.jpg"> </div> ... </div>
También puede anular las opciones predeterminadas en JavaScript como:
{
effect: 'fade',
pagination: true,
showArrows: true,
autoStart: false,
theme: 'fullwidth',
interval: 3000
}; Registro de cambios
08/10/2018
- Correcciones para cuando solo hay una diapositiva o no hay diapositivas





