Ecem Gokdogan

creating content on &

[Ecem Gokdogan @ecemgo]

@Sampatti_Maker @CodePen I’m really happy to hear that my projects inspired you. Thank you so much for these kind words! 🩵✨

[Ecem Gokdogan @ecemgo]

Responsive Dashboard with Sliders and Music Player

https://t.co/sPVARTbgXU
@CodePen #codepen

[GSAP @greensock]

💚 The new GSAP Demo Hub is here! 🤘

We’ve kicked things off with 50 demos, and there’s plenty more on the way, including some framework-specific collections and inspiring community contributions.

Browse by plugin, explore features and save your faves.

Would you like to contribute or suggest a demo? Get in touch, we’d love to hear from you! 💚✨

[Ecem Gokdogan @ecemgo]

Animated Swiper Slider with Connected Effects

✨ It includes:
• Outer slider with autoplay & progress bar
• Inner slider with creative effect
• Synced sliders that move together
• Text reveal animation
• Responsive layout

#SwiperJS #slider

🎬 https://t.co/zZi7K0wpnC

[Ecem Gokdogan @ecemgo]

Card Reveal Animation with GSAP ScrollTrigger ✨

✨ It includes:
• Text fade-out with ScrollTrigger
• Cards are revealed one by one
• Pinned section synced with scroll
• Hover effect using clip-path
• Responsive layout

#GSAP #ScrollTrigger

🎬 https://t.co/g3EB8tbj9i

[Arman Borkhani @Arman_Borkhani]

My pen for this week’s @CodePen challenge! I used CSS clip-path: shape() to create cards with inverted corners.
https://t.co/xdHNJ1JYW3

[Ecem Gokdogan @ecemgo]

@Arman_Borkhani @CodePen It’s such a creative idea, Arman. Thanks for sharing it! 😊

[Ecem Gokdogan @ecemgo]

Image Transitions Between Sections on Scroll | GSAP

✨ It includes:
• Built with GSAP Flip & ScrollTrigger
• Responsive design with GSAP matchMedia
• Flip animation on desktop & tablet
• Static layout on smaller screens

#GSAP #ScrollTrigger #Flip

🎬 https://t.co/4VCjSGa0th

[Ecem Gokdogan @ecemgo]

📌 Horizontal Scroll with Opposite Direction using GSAP ScrollTrigger

✨ It also includes:
• Cloning images dynamically with JavaScript
• Smooth, responsive, and dynamic layout

#GSAP #ScrollTrigger

🎬 https://t.co/lQIDPIW58L

[Ecem Gokdogan @ecemgo]

Two-Column Opposite Vertical Scroll Effect with GSAP 🚀

✨ It includes:
• Two image columns move in opposite directions
• Built with ScrollTrigger & ScrollSmoother
• Smooth and responsive layout

#GSAP #ScrollTrigger

🎬 https://t.co/56LOw59Zhg

[Carl 💥 Creative Coding Club @snorklTV]

🚀Use Mouse Position to Change Scroll Speed
The scrolling speeds up as you get farther from center.
The distance from center "distanceX" is mapped to an animation's timeScale().

timeScale = gsap.utils.mapRange(-300, 300, -3, 3, distanceX)

Full Lesson Video and Demo 🧵

[Ecem Gokdogan @ecemgo]

Swiper Slider with Parallax & Zoom Effects

✨ It includes:
• Parallax image movement
• Scale (zoom) animations
• Mousewheel control

#swiperjs #slider

🎬 https://t.co/mRPiFpbIWj

[Ecem Gokdogan @ecemgo]

GSAP ScrollTrigger: Diagonal Image Motion + Marquee Text

✨ It includes:
• Sequential diagonal images on scroll
• Marquee text
• Particle background animation
• Responsive adjustments

#GSAP #ScrollTrigger

🎬 https://t.co/edxWkD3IZf

[Arman Borkhani @Arman_Borkhani]

Josh Comeau's interactive article is a great introduction to SVG fundamentals.

https://t.co/HPHD8WmKlg

[Ecem Gokdogan @ecemgo]

@Arman_Borkhani Thanks for sharing, Arman! Very clear explanation with examples 😌🌟

[Ecem Gokdogan @ecemgo]

Stacked Cards with GSAP ScrollTrigger & ScrollSmoother

✨ It includes:
• Creating stacked cards
• Animate cards with clip-path effects (run once on enter)
• Use ScrollTrigger for scroll animations
• Smooth scrolling with ScrollSmoother

#GSAP

🎬 https://t.co/ZCoAuOLcTI

[Ecem Gokdogan @ecemgo]

@MariyaHari81424 Thanks a lot, Mariya! 🩵

[Ecem Gokdogan @ecemgo]

Swiper slider with a wavy slide transition effect using GSAP and an SVG filter 🌊✨

#swiperjs #gsap

🎬 https://t.co/1ECxja38Z3

[Ecem Gokdogan @ecemgo]

@mobalti Happy you liked it! Thank you, Arby! 🤗

[Ecem Gokdogan @ecemgo]

@Wimbledon Congratulations @ZeynepSonmez__ 😍

[Ecem Gokdogan @ecemgo]

@Arman_Borkhani Thanks, Arman! 🤗

[Ecem Gokdogan @ecemgo]

Swiper Creative Effect Slider with Cell-Based Animation using Splitting.js

Includes mousewheel control, autoplay and responsive design.

#swiperjs #slider #splittingjs

🎬 https://t.co/nHow3JV8qs