Learn Scrolling Animation with Locomotive JS! 🌈 | Animated Website Tutorial | HTML CSS JS

Discover the magic of scrolling animations with Locomotive JS! 🌈 Learn step-by-step in this animated website tutorial using HTML, CSS, and JS. Elevate your web design skills today! 🚀✨

Instructor in this video: Sarthak Sharma

Socials:
Peace ✌️

#webdesign #animationtutorials #webdevelopment #css #coding #javascript

[saar_thack]

Complete GSAP tutorial is in making, ye bhi bata do ki GSAP with react bhi leke aana chahiye kya?🤔(obviously with project)😎

[devyanibhosalee]

👀The value of this 2-hour video surpasses that of my entire year in college 🎓

[jhonsnow]

00:02 Learn the real usage of Locomotive GS
02:00 Understanding UI and UX in web development.
05:24 Locomotive JS provides smooth scrolling and improved user experience.
07:18 Learn about the setup of Locomotive JS for scrolling animations.
10:57 Understanding how to set element sizes based on viewport and parent heights.
12:46 Using images to enhance website visual appeal
16:56 Using Locomotive JS for website animations
18:30 Learn how to implement scrolling animation using Locomotive JS
22:00 Learn to implement smooth scrolling animation with Locomotive JS
23:36 Learn to customize scrolling animation using Locomotive JS
27:02 Learn to control scrolling animation speed with Locomotive JS
28:44 Learn about implementing scrolling animation with Locomotive JS.
32:10 Locomotive Scroll version 5 brings new features and improvements.
33:55 Learn to use Locomotive JS in React for creating scrolling animation.
37:39 Learn how to create scrolling animation with Locomotive JS
39:31 Learned about CSS styling and Locomotive JS positioning
43:21 Learn about creating a scrolling animation with Locomotive JS for an animated website
44:54 Creating multiple pages with Locomotive JS
48:31 Creating scrolling animation with Locomotive JS
50:06 Learn how to customize scrolling animation with Locomotive JS
54:19 Learn how to create a light animation
56:00 Learn to create scrolling animation with Locomotive JS
59:14 Learn how to create scrolling animations using Locomotive JS.
1:01:11 Creating a scrolling animation with Locomotive JS.
1:05:49 Learn how to adjust z index and enable sound for videos with Locomotive JS.
1:07:33 Learn scrolling animation with Locomotive JS
1:11:12 Creating a timeline and styling elements
1:13:23 Learn to create scrolling animations using Locomotive JS
1:18:27 Implementing scrolling animation with Locomotive JS
1:20:53 Learn how to create scrolling animations with Locomotive JS.
1:24:45 Exploring scroll animation using Locomotive JS.
1:27:32 Learn how to create a scrolling animation with Locomotive JS
1:31:13 Setting up animations with Locomotive JS
1:33:04 Learn how to create scrolling animation with Locomotive JS
1:36:49 Learn about setting the duration and timing function of the animation in Locomotive JS.
1:38:32 Adjusting display flex properties and line height for scrolling animation
1:42:44 Learn to create scrolling animations with Locomotive JS
1:44:47 Learning to create scrolling animations with Locomotive JS
1:50:22 Creating a scrolling animation with Locomotive JS
1:52:08 Adjusting blur and pixel values for website animation.
1:55:56 Using querySelectorAll to select elements and execute functions on each element
1:57:57 Learn how to use Locomotive JS for scrolling animations in web development
2:02:17 Setting background color & image size in Locomotive JS
2:04:13 Creating a button at the end of the video
2:07:48 Creating an image container in HTML CSS
2:09:31 Creating scrolling animation and overlay in Locomotive JS
2:13:30 Adjusting font size and element width in CSS
2:15:34 Learning about opacity and transition effects
2:20:12 Creating scrolling animations using Locomotive JS
2:22:10 Creating and styling multiple image divs using HTML and CSS
2:25:53 Learn how to use Locomotive JS for scrolling animation
2:27:51 Learn how to create a scrolling animation with Locomotive JS
2:31:53 Learn how to create scrolling animations using Locomotive JS.
2:33:59 Encouraging audience engagement and feedback

[dhananjaygaur]

Commitment at 1:08:52 gsap with react, video will get soon😌

[vedanthundare]

harsh bhaiya and team ese hi padhate rehena and you are teaching the best i had ever seen on yt

[shadowslayer]

SIR MIND-BLOWING. Hope u keep bringing exciting stuff in React and Framer Motion too. Excited!!🎉🎉🎉

[saurav_]

oo bhai kya hi sikhaya hai hats off broo mind blowing stuff keep uploading this type of amazing stuff liked the most 😍🤩

[Bhushantbn]

Sarthak bhai is the best.. bhot mza aa gya..

[puchkag.p]

Bhaiya ap logo ke Frontend series bohot acha lagte hai... The Most awaited video for Me..Aurr Bhaiya plz ek tailwind css par ek Frontend project laa dena .. plz plz plz . Love From Tripura 😍😎

[Aman_yadav]

Aree bhaiya badhiyaa gajab he majja aa jayega 😊

[Technical_Ved]

Kya baat h bade entry to bahut tagdi kiye ho market me ✌️😎😎 Maan gay

[musaddekahmed]

thank youuuu for suchhh awesomee content bhaii ❤️❤️❤️ Love from Bangladesh

[WebDev-rxde]

⭐⭐⭐⭐⭐
Are bhaiya kitna aacha padhate ho Online YT pe bhi
Aisa lag rha hai ki offline class mein baith kr padh rahe hai - really full informative lecture + entertainment.

[FactsDude]

Awesome bhiya❤❤❤🎉🎉🎉 Finally Locomotive

[umangsharma]

Finally legend is back💯, Thanks for everything 🙏

[SavyaSharma-ijyy]

🙌It was a great project. i got help in js from this project thank you and keep moving forward

[harshavardhan]

it's a great video, learnt a lot from it🤩🤩

[UmerWD]

Yar Sarthak tu bnda great ha 💛 teray se bht kuch seekha ha

[harshkumargaur]

It's the best bhaiya, we need more

[Aman_yadav]

Bhaiyo jarur like karna video ko bhot mehnat lagti hai sheriyans team ki jarur like comment karna support Karo 😊