Navigation Bar Help for Portfolio Page

Navigation Bar Help for Portfolio Page
0.0 0

#1

Hey Everyone, I am currently working on the Personal Portfolio page. Most of what I’ve done has been fairly easy, and what I couldn’t do, google searches helped. However, I do not know how to make my navigation bar work. I’ve tried multiple different ways but I am so confused on how to actually make my navigation bar scroll down the page. I don’t know if i have missed something very easy, but it’s become rather frustrating. When I look at other people’s portfolios, It looks like a cluster and I don’t understand anything. Any feedback, or just somewhere to start, would be helpful.


#2

where is the link to the portfolio page?


#3

Look at position fixed if you want the nav bar to stay at a fixed position the whole time.

https://developer.mozilla.org/en-US/docs/Web/CSS/position

Try using scrollY and the scroll event if you want the nav bar to not be in a fixed position the whole time but instead stick to the top if the user scrolls below it.

EXAMPLE: https://codepen.io/Matthew_Keating/pen/eEOGjR
NOTE:Javascript is the only part required for the nav.

In the javascript check for if the user as scrolled below the top position of your nav bar. If they did the navbar’s top is set to the scrollY. If the user scrolls back up the navbar’s top is set to it’s original value.

https://developer.mozilla.org/en-US/docs/Web/Events/scroll
https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollY