window.addEventListener('load', function () {
function animateCounter(element, targetNumber, duration = 2500) {
const startNumber = 0;
const startTime = performance.now();
function updateCount(currentTime) {
const elapsedTime = currentTime - startTime;
const progress = Math.min(elapsedTime / duration, 1);
const easeOutProgress = 1 - Math.pow(1 - progress, 3);
const currentCount = Math.floor(
easeOutProgress * (targetNumber - startNumber) + startNumber
);
element.textContent = currentCount.toLocaleString('en-US');
if (progress < 1) {
requestAnimationFrame(updateCount);
} else {
element.textContent = targetNumber.toLocaleString('en-US');
}
}
requestAnimationFrame(updateCount);
}
const observerOptions = {
root: null,
threshold: 0.3
};
const counterObserver = new IntersectionObserver((entries, observer) => {
entries.forEach((entry) => {
if (entry.isIntersecting) {
const targetElement = entry.target;
const targetNumber = parseInt(targetElement.getAttribute('data-target'), 10);
if (!isNaN(targetNumber)) {
animateCounter(targetElement, targetNumber);
}
observer.unobserve(targetElement);
}
});
}, observerOptions);
const counterElements = document.querySelectorAll('.counter');
counterElements.forEach((element) => {
counterObserver.observe(element);
});
});
top of page
bottom of page
