Medium.com como la biblioteca de zoom de imagen-Lightense. js
| Autor: | sparanoid |
|---|---|
| Views Total: | 4,766 |
| Sitio oficial: | Ir a la web |
| Actualizado: | February 20, 2019 |
| Licencia: | MIT |
Vista prévia
Descripción
Lightense. js es una biblioteca JavaScript ligera y fácil de usar para el zoom de la imagen como se ve en Medium.com.
Características
- Visualice la imagen ampliada en una ventana emergente de lightbox.
- Color de fondo personalizado para la ventana emergente lightbox.
- Auto se descarta a medida que se desplaza hacia arriba/abajo de la página.
Funcionamiento
Coloque la biblioteca de JavaScript de Lightense. js en la parte inferior de la Página Web.
<script src="lightense.js"></script>
Inicialice Lightense en las imágenes de destino.
window.addEventListener('load', function () {
var el = document.querySelectorAll('img.lightense');
Lightense(el);
}, false); Cambie el color predeterminado de la superposición de fondo.
<img src="demo.png" data-background="rgba(0, 0, 0, 0.8)" class="lightense">
También puede especificar la ruta de la imagen en el atributo ' Data-Image '.
<a class="lightense" data-image="demo.png">Click me</a>
Todas las opciones de defauot.
{
time: 300, // animation speed
padding: 40,
offset: 40,
keyboard: true,
cubicBezier: 'cubic-bezier(.2, 0, .1, 1)',
background: 'rgba(255, 255, 255, .98)',
zIndex: 2147483647
}; Registro de cambios
02/20/2019
- v1.0.8
12/10/2018
- v1.0.6: bugfix
12/02/2018
- actualizar
08/15/2018
- Reescrito en ES6
