Change Navigation Bar Styles After Scrolling With JavaScript | HTML and CSS Tutorial

Today the video is a little different than usual. We are going to take a look at completed code then we will add the necessary JavaScript and CSS to change the navigation bar’s styles after we start scrolling the page.

[ SOURCE CODE ]

GitHub ► https://bit.ly/3ahyjLN

[ HELP SUPPORT THE CHANNEL ]

Get exclusive Patreon perks.
Patreon ► https://www.patreon.com/juliocodes

[ SOCIAL MEDIA ]

Instagram ► https://www.instagram.com/juliocodesyt

[ HOSTGATOR ]

Get affordable domain and web hosting with HostGator. Save up to 60% off of your entire purchase with the coupon code below.

HostGator ► https://bit.ly/2ZfR0u3
Coupon code ► JULIOCODES60
Video tutorial ► https://youtu.be/5B_LQqR0zsE

[ GET IN TOUCH – TUTORIAL HELP ]

1. Zip up your source code
2. Attach the zipped source code to the email
3. Explain your issue

Email ► [email protected]

[ MY GEAR ]

Programming/Video editing laptop Specs & extras

Laptop: Dell XPS 15 7590
Processor: 9th Generation Intel Core i7-9750h
RAM: 32GB (Upgraded)
Graphics Card: Nvidia GeForce GTX 1650 4GB GDDR5
Storage: 500GB M. 2 PCIe NVMe SSD (Upgraded)
— Extras —
Monitor: Dell Ultrasharp 27″
Keyboard: Logitech MX Keys
Mouse: Logitech MX Master 3
Microphone: Blue Yeti

Dell XPS 15 7590

United States ► https://amzn.to/2Gd7U4M
United Kingdom ► https://amzn.to/2NMJzqm
Canada ► https://amzn.to/2ReU08x
France ► https://amzn.to/2vcPU8n

CORSAIR Vengeance Performance RAM

United States ► https://amzn.to/38rWdmD
United Kingdom ► https://amzn.to/30FXNyA
Canada ► https://amzn.to/3awleix
France ► https://amzn.to/30JMkxX

Samsung 970 EVO Plus SSD

United States ► https://amzn.to/2NMIaAu
United Kingdom ► https://amzn.to/37hrJnc
Canada ► https://amzn.to/38tk9Gg
France ► https://amzn.to/2RfUdbC

Dell Ultrasharp 27″ Monitor

United States ► https://amzn.to/2u3UaGV
United Kingdom ► https://amzn.to/2Sxe9Hk
Canada ► https://amzn.to/37Cgl4B
France ► https://amzn.to/322WhqV

Logitech MX Keys Keyboard

United States ► https://amzn.to/2u0eEjM
United Kingdom ► https://amzn.to/2vABNtN
Canada ► https://amzn.to/2uUfCi7
France ► https://amzn.to/39EhU3v

Logitech MX Master 3 Mouse

United States ► https://amzn.to/31YvoEC
United Kingdom ► https://amzn.to/37Bm1Mm
Canada ► https://amzn.to/2vHySPH
France ► https://amzn.to/2Hv4E5u

Blue Yeti Microphone

United States ► https://amzn.to/2NNPSLr
United Kingdom ► https://amzn.to/2RiLKVb
Canada ► https://amzn.to/2RB6vdq
France ► https://amzn.to/30EJpqy

[ DISCLAIMER No. 1 ]

In order to speed up the development process CSS prefix are not used. In order to ensure cross browser compatibility please use prefixes where necessary.

[ DISCLAIMER No. 2 ]

This video description contain affiliate links, which means that if you click on one of the product links, I’ll receive a small commission. This helps support the channel and allows me to continue to make videos like this. Thank you for the support!

Post Author: hatefull