add class to body when observes done
This commit is contained in:
parent
b9bcde8dd9
commit
ce2e5b121b
|
@ -1,7 +1,19 @@
|
|||
(function() {
|
||||
const observeSelector = '.js-onscreen';
|
||||
const observedNodes = document.querySelectorAll(observeSelector);
|
||||
let observedCount = 0;
|
||||
let observedTotal = !!observeSelector ? observedNodes.length : 0;
|
||||
|
||||
window.addEventListener('DOMContentLoaded', event => {
|
||||
const intersectionSupport = !!window.IntersectionObserver;
|
||||
|
||||
function updateObservedCount() {
|
||||
observedCount++;
|
||||
if (observedCount >= observedTotal) {
|
||||
document.body.classList.add('observe-done');
|
||||
}
|
||||
}
|
||||
|
||||
function onScreenHandler(entries) {
|
||||
entries.forEach(entry => {
|
||||
if (entry.intersectionRatio > 0) {
|
||||
|
@ -12,7 +24,7 @@
|
|||
});
|
||||
}
|
||||
|
||||
document.querySelectorAll('.js-onscreen').forEach(el => {
|
||||
observedNodes.forEach(el => {
|
||||
if (intersectionSupport) {
|
||||
const options = {
|
||||
rootMargin: '0px',
|
||||
|
@ -22,6 +34,7 @@
|
|||
observer.observe(el);
|
||||
el.classList.add('is-observed');
|
||||
}
|
||||
updateObservedCount();
|
||||
});
|
||||
});
|
||||
})();
|
||||
|
|
Loading…
Reference in New Issue