Plugin de comparación de imágenes de JavaScript Vanilla-BeforeAfterJs
| Autor: | odimodugno |
|---|---|
| Views Total: | 2,437 |
| Sitio oficial: | Ir a la web |
| Actualizado: | February 10, 2016 |
| Licencia: | MIT |
Vista prévia
Descripción
BeforeAfterJs es un simple y puro plugin de comparación de imágenes de JavaScript que se utiliza para comparar la diferencia entre las imagenes con un efecto deslizante suave.
Funcionamiento
Descargue el complemento e incluya el archivo JavaScript Before-after. js en el documento.
<script src="src/before-after.js"></script>
El HTML.
<div id="before-after-1" class="before-after"> </div> <div id="before-after-2" class="before-after"> </div>
Inicializa el plugin y especifica las imágenes que quieres comparar.
new beforeAfter({
'elId'
: 'div-id-on-the-dom',
'before'
: 'before.jpg',
'after'
: 'after.jpg'
}); También puede envolver las imágenes antes/después en el elemento DIV de la siguiente manera.
<div class="before-after" data-before-after> <img src="before.jpg"> <img src="after.jpg"> </div>
