43 lines
1.1 KiB
JavaScript
43 lines
1.1 KiB
JavaScript
(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) {
|
|
entry.target.classList.add('is-showing', 'has-shown');
|
|
} else {
|
|
entry.target.classList.remove('is-showing');
|
|
}
|
|
});
|
|
}
|
|
|
|
document.body.classList.add('rwavw-custom');
|
|
|
|
observedNodes.forEach(el => {
|
|
if (intersectionSupport) {
|
|
const options = {
|
|
rootMargin: '0px',
|
|
threshold: [0, 1],
|
|
};
|
|
const observer = new IntersectionObserver(onScreenHandler, options);
|
|
observer.observe(el);
|
|
el.classList.add('is-observed');
|
|
}
|
|
updateObservedCount();
|
|
});
|
|
});
|
|
})();
|