How to fix top menus on scroll?

I’m writing code from YouTube, I can’t fix the menu at the top #nav how to do it?

Can’t even see the menu on that background.

That’s way too complicated and a nightmare to use.

It’s a parallax demo and you can’t fix the menu because because of the perspective on the body.

If you remove the perspective.

html, body{ 
    height: 100%;
    width: 100%;
   /*perspective: 800px;*/
    background-color: black;  
}

Now the menu will fix but you lose the parallax.

When scrolling, the menu should be highlighted in black and pinned to the top.

AAAAA means not everything is as simple as it always works, this is understandable, but this is to be expected, since it is not possible to understand the working of programming.

Yes as mentioned.

Then this happens:

You need to go back to where you got the code from and check the original has the behaviour you want.

yes the original works well

Can we see it somewhere as it would help to diagnose your problem?

That one seems to be working ok?

Do you still have a problem with it?

No, I just copied the code because it was hard to understand why it didn’t work.

I told you why it didn’t work and it was the perspective added to the body element that breaks it which is not in the working version and neither is the background on the body which hides the first element.

html, body{
  
    height: 100%;
    width: 100%;
    /*perspective: 800px;
    background-color: black;
    */
}

I understand that thanks

1 Like