Ghost navbar

The navigation bar is hidden till the page scrolling. See test attached test projecttest.bloc (727.8 KB)

When opening your project, I have the same problem, but I delete the top navigation and add it again, it works like expected. How do you add the background behind the navigation?

The bloc below the navigation bloc has the top margin set to -100px, which moves it up behind the nav bloc. I believe the issue has something to do with the “Sticky” setting. I don’t normally use the sticky setting as I prefer to use css to position it as “fixed” instead, as I find that the header being fixed seems more stable and predictable than the “bouncy” affect I see with the sticky header. I can see though how this “ghost” effect as you called it could be useful if you wanted the header hidden until scrolling is initiated. A cool effect in the right circumstances.

Solved by applying a class in external css with “z-index:1000” to the column that contain the navbar

1 Like

@susanoo, I see now… actually, even z-index:1; does the trick. Because you moved the lower bloc up 100px, it covered the header. the z-index of the lower bloc must be 0. And apparently then, the “sticky” setting involves some sort of javascript which changes/increases the z-index upon scrolling. good to know.

1 Like