Robolisk Robolisk - 1 year ago 109
CSS Question

navbar is split into multiple div classes - how to stick them all to the top on scroll? (javescript) is the website and it's created in wordpress.

the entire navigation section is encompassed by


although, it has a couple different
's and a
within it.
How can I grab all of these and have them stick to the top while scrolling down? does exactly what I'm trying to emulate

The way this website work's is all the html is created via php so changing the structure is slightly difficult and something I'd prefer to avoid. I was hoping I could apply some css of some sort and have it stick.

here is some javascript I tried to use on the navigation menu. I added a ID to the navigation menu so I can target it easily.

window.onscroll = changePos;

function changePos()
var header = document.getElementsById("navmenu");
if (window.pageYOffset > 70)
{ = "fixed"; = "0";
{ = ""; = "";

and it never worked :/
This script makes perfect sense to me?

Answer Source

Put the header fixed:

.mkd-top-bar {
  position: fixed;

.mkd-page-header {
  position: fixed;
  top: 33px;


And separate the content with margin top:

.mkd-content { 
  margin-top: 200px;

Example scrolling

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download