Detección avanzada de estado visible-visibilityEvents. js
| Autor: | jmalarcon |
|---|---|
| Views Total: | 51 |
| Sitio oficial: | Ir a la web |
| Actualizado: | April 13, 2019 |
| Licencia: | MIT |
Vista prévia
Descripción
visibilityEvents. js es una biblioteca de detección avanzada ' is in viewport ' para determinar si una parte o todo el elemento está dentro de la ventanilla.
Funcionamiento
Instalación.
# NPM $ npm install visibilityevents --save
Importe el visibilityEvents. js en el documento.
<script src="visibilityEvents.js"></script>
Desencadenar un evento cuando el elemento está completamente visible.
var myEl = document.getElementById("element-to-track");
myEl.addEventListener('show', function(){
// do something
}); Desencadenar un evento cuando una parte del elemento es visible.
var myEl = document.getElementById("element-to-track");
myEl.addEventListener('showpart', function(ev){
console.log("Event: %s for %s. Visibility state: %s", ev.type, ev.target.id, ev.detail.visible);
}); Desencadenar un evento cuando el elemento está completamente oculto.
var myEl = document.getElementById("element-to-track");
myEl.addEventListener('hide', function(){
// do something
}); Desencadenar un evento cuando se oculta una parte del elemento.
var myEl = document.getElementById("element-to-track");
myEl.addEventListener('hidepart', function(ev){
console.log("Event: %s for %s. Visibility state: %s", ev.type, ev.target.id, ev.detail.visible);
});
