You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
27 lines
554 B
JavaScript
27 lines
554 B
JavaScript
const baloons = document.getElementsByClassName("baloon");
|
|
|
|
// Threshold Callback
|
|
|
|
let threshold = [];
|
|
for (let i = 0; i <= 1.0; i += 0.01) {
|
|
threshold.push(i);
|
|
}
|
|
|
|
let callback = (entries) => {
|
|
entries.forEach((entry) => {
|
|
if (entry.isIntersecting) {
|
|
entry.target.classList.add("roll");
|
|
observer.unobserve(entry.target);
|
|
}
|
|
});
|
|
};
|
|
|
|
let observer = new IntersectionObserver(callback, {
|
|
rootMargin: "0% 0% -100% 0%",
|
|
threshold: threshold,
|
|
});
|
|
|
|
Array.from(baloons).forEach((baloon) => {
|
|
observer.observe(baloon);
|
|
});
|