add class to body when observes done

This commit is contained in:
Ray Elliott 2020-05-21 17:13:46 +01:00
parent b9bcde8dd9
commit ce2e5b121b
1 changed files with 14 additions and 1 deletions

View File

@ -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();
});
});
})();