@chiniu07: #CapCut #cheyiheng_陈奕恒 #trandichhang #xgggggggggggggggggggggg #viraltiktok

𝘾𝙝𝙞𝙣♡
𝘾𝙝𝙞𝙣♡
Open In TikTok:
Region: VN
Friday 06 February 2026 13:15:27 GMT
622
121
1
2

Music

Download

Comments

chiniu07
𝘾𝙝𝙞𝙣♡ :
đù flop à
2026-02-07 09:10:35
3
To see more videos from user @chiniu07, please go to the Tikwm homepage.

Other Videos

How I build with Lovable 👇 Academy in bio 🔗 Horizontal gallery driven by vertical scroll, step by step: 1. Wrap section, height 300vh. That extra height is only there to give the scroll something to eat. 2. Inside, a sticky container: position sticky, top 0, height 100svh, overflow hidden. Use svh, not vh, or mobile browsers cut it. 3. Inside that, the track: display flex, gap 4vw, width max-content. Never set a pixel width, let the content decide. 4. Move it with ScrollTrigger: gsap.to('.track', { x: function() { return -(track.scrollWidth - window.innerWidth); }, ease: 'none', scrollTrigger: { trigger: section, start: 'top top', end: 'bottom bottom', scrub: 1 } }). 5. Return the value in a function, not a fixed number. On resize the width changes and a hardcoded value breaks the last card off screen forever. 6. ease: 'none' is mandatory here. Any easing and the images drift out of sync with the thumb. 7. Now the part that makes it look designed: give the cards different heights and different vertical offsets. 60vh, 45vh, 70vh, some with margin-top 8vh, some with 0. Equal cards read as a template, uneven cards read as a magazine spread. 8. object-fit: cover on every image, fixed aspect ratio per card, so nothing squashes when the content changes. 9. Add a horizontal progress bar under it: scaleX from ScrollTrigger progress, transform-origin left. People need to know how much gallery is left or they scroll away. 10. Kill it on mobile: ScrollTrigger.matchMedia, and below 768px it becomes a normal vertical stack. Horizontal scroll on a phone fights the browser gesture and always loses. Save this if you build for studios 🏛️ #lovablepartner #buildinpublic #webdesign #motion
How I build with Lovable 👇 Academy in bio 🔗 Horizontal gallery driven by vertical scroll, step by step: 1. Wrap section, height 300vh. That extra height is only there to give the scroll something to eat. 2. Inside, a sticky container: position sticky, top 0, height 100svh, overflow hidden. Use svh, not vh, or mobile browsers cut it. 3. Inside that, the track: display flex, gap 4vw, width max-content. Never set a pixel width, let the content decide. 4. Move it with ScrollTrigger: gsap.to('.track', { x: function() { return -(track.scrollWidth - window.innerWidth); }, ease: 'none', scrollTrigger: { trigger: section, start: 'top top', end: 'bottom bottom', scrub: 1 } }). 5. Return the value in a function, not a fixed number. On resize the width changes and a hardcoded value breaks the last card off screen forever. 6. ease: 'none' is mandatory here. Any easing and the images drift out of sync with the thumb. 7. Now the part that makes it look designed: give the cards different heights and different vertical offsets. 60vh, 45vh, 70vh, some with margin-top 8vh, some with 0. Equal cards read as a template, uneven cards read as a magazine spread. 8. object-fit: cover on every image, fixed aspect ratio per card, so nothing squashes when the content changes. 9. Add a horizontal progress bar under it: scaleX from ScrollTrigger progress, transform-origin left. People need to know how much gallery is left or they scroll away. 10. Kill it on mobile: ScrollTrigger.matchMedia, and below 768px it becomes a normal vertical stack. Horizontal scroll on a phone fights the browser gesture and always loses. Save this if you build for studios 🏛️ #lovablepartner #buildinpublic #webdesign #motion

About