Position Fixed header to scroll

fix.html

<script>
  fixedHeader = () => {

  this.fix = () => {
    if (window.innerWidth < 768) {
      window.onscroll = function () {
        myFunction()
      };

      var header = document.querySelector(".header");
      var sticky = header.offsetTop;
      function myFunction() {
        if (window.pageYOffset > sticky) {
          header.classList.add("sticky");
          document.querySelector('body').classList.add("sticky")
          document.body.style.marginTop = header.offsetHeight + 'px'
        } else {
          header.classList.remove("sticky");
          document.querySelector('body').classList.remove("sticky")
          document.body.style.marginTop = '';
        }
      }

    }
  }
  this.fix()

}

fixedHeader()
</script>
<style>
  .header.sticky {
    position: fixed;
    top: 0;
    width:100%;
    z-index: 9999;
    background: #f0f0f0;
  }  
</style>