How to make navigation at top of website turn from having transparent background while on image to color background when scroll

Question

I have at first an image full page, and as I scroll down image goes away; when you only open website navigation bar and centered logo are kinda transparent and it's background is the part of the image they located at. But when I scroll down I want image to go away and when page will reach logo I want it to appear at the left upper corner while navigation bar and logo itself from having "transparent" background, will have colored one.
I don't know how to do it, and I can't really find info about such transition on the Internet.

Please help me with this task.
Thanks!

Answer 1

Share your code

Answer 2

https://www.sololearn.com/discuss/3092218/?ref=app
https://www.sololearn.com/discuss/712/?ref=app
https://www.sololearn.com/discuss/2850337/?ref=app
https://www.sololearn.com/discuss/1532778/?ref=app