How to Create an Awesome Horizontal Scroller
HTML-код
- Опубликовано: 14 июн 2024
- designcourse.com/af 👈 AdvancedFrontends - Use code "INTERACTIVITY" for 30% off! Only good until 9/27!
-- Today, I'm sharing with you a lesson video from my Advanced Frontends course. It will walk you through how to create a horizontal scroller layout using JavaScript, the GreenSock Animation Platform (GSAP), and Lenis smooth scroll.
0:00 - Intro
1:09 - HTML
7:00 - CSS Overview
8:30 - JavaScript & GSAP
18:34 - Final Thoughts
Let's get started!
#frontend #javascript
- - - - - - - - - - - - - - - - - - - - - -
Subscribe for NEW VIDEOS!
Learn UI/UX: designcourse.com
My personal FB account: logodesigner
Coursetro FB: coursetro
Coursetro's Twitter: / designcoursecom
Join my Discord! / discord
^-Chat with me and others
- - - - - - - - - - - - - - - - - - - - - -
Who is Gary Simon? Well, I'm a full stack developer with 2+ decades experience and I teach people how to design and code. I've created around 100+ courses for big brands like LinkedIn, Lynda.com, Pluralsight and Envato Network.
Now, I focus all of my time and energy on this channel and my website Designcourse.com.
Come to my discord server or add me on social media and say Hi! 
Хобби
I can't wait to show you all the final project in the course. Be sure to join up, just 24hr left! designcourse.com/af
Getting your moneys worth on GSAP. Been loving the vids. 🤘
Awesome.
Awesome awesome stuff
How to deal with mobile if I don’t want it to be horizontally scrollable, but vertical?
Sir you course is🔥 👑❤😍😍 but it's not affordable for me
Sir I don't know how to buy it, all the payment options are not available for me, i dont own a credit card and I don't have a PayPal account and neither do my parents, I want to purchase this, is there another way?
we dont have left for start value , so how u used it ?
May I ask, what plugin or option are you using for VS code where it helps out with a suggestive autocomplete when typing code?
did u find it? D:
its code pilot
Hello! I enrolled for the UX/UI course. I think it would be nice to have a Discord for your students and tutors to discuss things
We do. When you visit the course cirruculum page on designcourse.com, you should see a discord server button on the top right if you're on desktop.
@@DesignCourseFound it. Thx! :)
nice
How can I shift my course if I purchased the wrong course by accident? I wanted the Advanced Frontend Course.
Very cool, now let's make it mobile friendly. This looks great on desktop but kinda falls apart on the mobile device. I would like to know more about mobile responsiveness and how these cool JS tools will adapt
It's easily doable with media queries, and Greensock's matchMedia.
@@DesignCoursethis is the exact problem I’m facing with a current project. Your comment just saved me a ton of time.
This is a pretty cool animation, but I have an issue with it...isn't it an accessibility issue to be scrolling content horizontally when the user is attempting to scroll *vertically*? At the very least, it's a bad UX right? If I scroll vertically with my mouse wheel I expect the page to scroll in the vertical direction, but you've intercepted that, basically, and modified that to scroll horizontally instead. Personally, as a user, I *hate* it when that happens. Vertical scrolling is vertical scrolling, not horizontal.
There isn't a horizontal scroll wheel. I think it's fine so long as it's only vertical or only horizontal.
@@alzaresh There's a horizontal scroll on my mouse! :P But sure, I get that it's not common. The point still holds though - vertical is vertical, not horizontal.
It grabs user attention though
Looks as if he invented animation 😳
AdvancedFrontends promise.