Instructions
A complete guide to editing content, managing assets, and tailoring Curivo to your brand.
Build immersive experiences with confidence.
This guide walks you through every GSAP animation included in Curivo, explaining how each script works and where you can customize it to match your brand and creative direction.
This guide walks you through every GSAP animation included in Curivo, explaining how each script works and where you can customize it to match your brand and creative direction.
Lenis script code
<script>
const lenis = new Lenis({ duration: 1.6 });
lenis.on('scroll', ScrollTrigger.update);
gsap.ticker.add((time) => {
lenis.raf(time * 1000);
});
gsap.ticker.lagSmoothing(0);
</script>Data Count
<script>
//for number count down animate
gsap.registerPlugin(ScrollTrigger);
document.querySelectorAll('[data-count]').forEach((el) => {
const finalValue = el.getAttribute('data-count');
const number = parseInt(finalValue.replace(/\D/g, ''));
const suffix = finalValue.replace(/[0-9]/g, '');
let obj = { value: 0 };
gsap.to(obj, {
value: number,
duration: 2,
ease: 'power2.out',
onUpdate: () => {
el.textContent = Math.floor(obj.value) + suffix;
},
scrollTrigger: {
trigger: el,
start: 'center 100%',
once: true,
},
});
});
</script>.webp)