Crear fondos de movimiento automático en JavaScript puro-slizer. js
| Autor: | mahmoudJordan |
|---|---|
| Views Total: | 109 |
| Sitio oficial: | Ir a la web |
| Actualizado: | April 12, 2019 |
| Licencia: | MIT |
Vista prévia
Descripción
slizer. js es un plugin de JavaScript ligero para desplazar automáticamente la imagen de fondo de un contenedor al igual que un carrusel. Ideal para fondos panorámicos.
Funcionamiento
Cargue el script slizer. js en el documento.
<script src="Slizer.js"></script>
Agregue una imagen de fondo al contenedor.
<div id="example"></div>
#example {
background-image:
url("panorama.jpg");
} Conecte el Slizer a la imagen de fondo. Hecho.
const object = document.getElementById("example");
const slized = new Slizer(object); Establezca la dirección de desplazamiento. Predeterminado: ' h ' (horizontal).
const slized = new Slizer(object, {
Direction : 'v'
}); Ajuste la velocidad de desplazamiento.
const slized = new Slizer(object, {
RoundInterval : 100,
PixelPerRound : 1
}); Decida si desea utilizar o no los estilos de fondo predeterminados. Valor predeterminado: false.
- backgroundRepeat: reapeat
- backgroundAttachment: fijo
- backgroundPosition: 0 0
const slized = new Slizer(object, {
ApplyDefaultStyle : true
});
