document.addEventListener("DOMContentLoaded", () => { gsap.registerPlugin(ScrollTrigger); const slides = gsap.utils.toArray(".slide"); // Timeline for slides animation const tl = gsap.timeline({ scrollTrigger: { trigger: ".hero-section", start: "top top", end: "+=400%", // 4x the viewport height for smooth transitions scrub: true, pin: true, }, }); // Animate each slide sequentially slides.forEach((slide, index) => { tl.fromTo( slide, { opacity: 0, transform: "translateY(100%)" }, // Slide in from below { opacity: 1, transform: "translateY(0%)", duration: 1 }, // Fully visible index * 1.5 // Adjust timing for each slide ).to( slide, { opacity: 0, transform: "translateY(-100%)", duration: 1 }, // Slide out to above (index + 1) * 1.5 // Adjust timing for slide-out ); }); });

I Design

Human-Centric Websites

I Create

Impactful Brands

I Innovate

Strategic Concepts

I Deliver

Exceptional Experiences

your Imagination, my Design.
I design human centric websites, brands, apps, & ideas

Behance

Dribble

LinkedIn

YouTube

Vimeo

Pinterest

Medium

Smallprint, etc.

© 2K24, idaete.com All rights reserved. All other trademarks are the property of their respective owners. If actual people, companies, brands, bands, or animals are referred to, it’s in the spirit of free advertising.