CSS Parallax Header And Sticky Navigation Mutually Exclusive?

I'm working on a new HTML5 CSS3 template which features a parallax scrolling header, as well as sticky navigation menu and a scroll to top link. I've gotten the elements working i

Solution 1:

Updated:

Change it from:

header::before {
    position: absolute;
}

to:

header::before {
  position: fixed;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
}

-moz is for Mozilla; -webkit is for Chrome. Hope it should work.