Having encountered this clever, mobile-friendly navigation that uses Javascript (JS):
CodyHouse Smart Fixed Navigation
...I challenged myself with creating something similar, using only CSS.
Here's the result:
View on Codepen (HTML+CSS/Less source code)
Please note, that my version may have accessibility issues, and should thus only be used for progressive enhancement like same-page jumplinks, i.e. not as the only means of (primary) navigation.
Note the "hamburger button" (three horizontal lines) might not be sufficiently recognizable as navigation.
Also, I have discovered that my version doesn't work in iOS Safari. I haven't found a fix (yet), but it has likely to do with position: fixed
and/or z-index
.