
Flowsuite is built for seamless customization—follow this guide to set up your content, adjust layouts, and launch with confidence.
<script>
document.addEventListener("DOMContentLoaded", () => {
gsap.registerPlugin(ScrollTrigger);
const counters = document.querySelectorAll(".counter");
counters.forEach(counter => {
const text = counter.textContent.trim();
const number = parseFloat(text.replace(/[^0-9.]/g, ""));
const suffix = text.replace(/[0-9.,]/g, "").trim();
const obj = { value: 0 };
gsap.to(obj, {
value: number,
duration: 3,
ease: "power2.out",
scrollTrigger: {
trigger: counter,
start: "top 85%",
toggleActions: "play none none none",
once: true
},
onUpdate: () => {
const finalValue =
number % 1 !== 0
? obj.value.toFixed(1)
: Math.floor(obj.value);
counter.textContent =
Number(finalValue).toLocaleString() + suffix;
}
});
});
});
</script>