monners
8/18/2017 - 5:40 AM

Basic scrollLock class for mobile menus

Basic scrollLock class for mobile menus

class ScrollLock {
  constructor () {
    this.pageBody = document.querySelector('.body');
    this.scrollY = 0;
  }

  saveScrollY = (num) => {
    this.scrollY = num;
  }

  setScrollY = (num) => {
    window.scroll(0, num);
  }

  setScrollOffset = (vOffset) => {
    this.pageBody.style.top = `-${vOffset}px`;
  }

  freezeBodyScroll = () => {
    this.saveScrollY(window.scrollY);
    this.setScrollOffset(this.scrollY);
    this.pageBody.classList.add('is-fixedMobile');
  }

  unfreezeBodyScroll = () => {
    this.pageBody.classList.remove('is-fixedMobile');

    // Don't reset scroll position if lock hasn't occurred
    if (this.scrollY === 0) return;
    this.setScrollOffset(0);
    this.setScrollY(this.scrollY);
    this.saveScrollY(0);
  }
}

export default ScrollLock;