32 lines
897 B
JavaScript
32 lines
897 B
JavaScript
// Fade-in on scroll for elements with .reveal
|
|
(function () {
|
|
var items = document.querySelectorAll(".reveal");
|
|
if (!items.length) return;
|
|
|
|
var show = function (el) { el.classList.add("is-visible"); };
|
|
|
|
if (!("IntersectionObserver" in window)) {
|
|
items.forEach(show);
|
|
return;
|
|
}
|
|
|
|
// small stagger for siblings inside the same container
|
|
var groups = new Map();
|
|
items.forEach(function (el) {
|
|
var parent = el.parentElement;
|
|
var n = groups.get(parent) || 0;
|
|
el.style.setProperty("--delay", n * 120 + "ms");
|
|
groups.set(parent, n + 1);
|
|
});
|
|
|
|
var io = new IntersectionObserver(function (entries) {
|
|
entries.forEach(function (entry) {
|
|
if (!entry.isIntersecting) return;
|
|
show(entry.target);
|
|
io.unobserve(entry.target);
|
|
});
|
|
}, { threshold: 0.15, rootMargin: "0px 0px -8% 0px" });
|
|
|
|
items.forEach(function (el) { io.observe(el); });
|
|
})();
|