Bootstrap 5 Transparent Navbar to Solid Color on Scroll

[@MyGoldmine]

GOD BLESS YOU FOR THIS EASY TO FOLLOW TUTORIAL!!! ✨✨✨

[@ByteGrad]

Hi, mastering CSS is critical as a front-end developer: www.udemy.com/course/professional-css/?referralCode=4C3C08E82629E6B15752
Also, mastering JavaScript is critical if you want to be a modern, professional developer: www.udemy.com/course/professional-javascript-course/?referralCode=0C1D5752923168BC87C2

[@dorotazak7762]

I'd like to thank you for this tutorial as well as for all of the knowledge you share on your channel - the work you put out there is beyond helpful! Thanks a lot for making other's lives easier👌Sending warm regards🖤

[@SweetMelodies_Official]

Thank you very much for this tutorial sir, it really helps me!

[@dxtxxdx12]

헐 chat-gpt도 못한 걸 이거 따라하고 성공했어요 감사합니다:D THANK YOU!!

[@inukauleunywe5717]

I really appreciate what you are teaching us. You are a such wonderful mentor. I promise, i will keep following you

[@MartinMüller-e8e]

Thanks for the short tutorial.
Works as shown in the video.
But there is a small one? Problem.
When displayed on small devices (e.g. mobile 763px), clicking on the hamburger menu causes the menu to be displayed transparently. The class (black) is only added from the set size.
Is there an option in such cases to load the class when you click on the button?
Thanks in advance

[@Ricky_017]

Great tutorial

[@juantoledo1900]

Thanks so much, you really helped me out

[@edal61]

Man, THANKS so much!

[@chrisqiuu]

Thanks man, you just gained another subscriber!

[@marinaromany5663]

that's great
thank you so much

[@daiapolo4604]

Estuve buscando un código así de simple por mucho tiempo, soy nueva en esto de javascript. GRACIAS

[@danielj6394]

Thanks
That is exactly what I need

[@pacoperico1109]

Excellent material. THANX

[@joshwzr1257]

Thanks alot for this tutorial.
I appreciate

[@kettysi]

Hello! Thank you for your lesson.

[@Anaconda55555]

thank bro

[@e65e5fov75bop]

but if I scroll the page to Y=156, the function will be executed 100 times?

[@amabsteve2594]

Thank you much i just subscribe

[@demm9000]

Thank you!!! Exactly what I need it!!!! :D

[@nadeeralakshan3598]

Thanks bro

[@ricardovlz5703]

Hi, I was implementing this with a slide as a background of the transparent navbar, so I was obligated to use position absolute as you did with the bg.image, but the rest of the page is under the slide, I was thinking to leave it like that, with a padding top, but is responsive so that's breaks all. Idk if you can help me

[@rafiashan8389]

yeah i was wondering same. Hope ByteGrad can reply to your message.

[@Anaconda55555]

you can use position: relative
works for me

[@deeptiyadav8182]

Thank you so much sir.! Can we make it transparent without fixed-top. Actually while scrolling it is fixed so webpage does not look good. Please guide.

[@ByteGrad]

Hi, sorry I don’t know what you mean

[@deeptiyadav8182]

@@ByteGrad I meant you removed navbar-light and added fixed-top in nav class. Is there a way to make navbar transparent another than this.? Actually while making my project I did as shown in your video but since nav is transparent and fixed in position every content passes through it.

[@deeptiyadav8182]

@@ByteGrad don't know if you understand my problem now

[@ByteGrad]

@@deeptiyadav8182 It will become a solid color after scrolling a bit, right? You can also reduce the number of pixels it takes for it to change into a solid color.

[@financiallyfreegenz]

great. solved my problem

[@AJ19_vlog]

Thank u so much brother ❤❤

[@rupertebohon9580]

thanks again lol i really need to learn javascript

[@sanjayprajapat6884]

Thank you so much

[@joshwzr1257]

You deserve a sub

[@fawaazfaris]

Thanks man

[@OmosanyaKanyinsola]

Hope this will work for iOS device too

[@webdevgangsta]

You are amazing

[@PalaniVelK-]

day long wasted on working with document.getelementby id instead of document .query selector.THANKS A LOT BRO

[@re1n751]

thx.