felvieira
11/26/2018 - 11:48 PM

Fixed div onscroll

Conforme você faz scroll a div fixa

const fixContact = document.querySelector('#single .right-container > .box-wpp') || '';

function getBreakpoint() {
  let w = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
  return (w < 768) ? 'mobile' : ((w < 992) ? 'tablet' : ((w < 1200) ? 'desktop' : 'full'));
}

  if (fixContact) {
    window.onscroll = function (e) {
      let breakpoint = getBreakpoint();
      // cross-browser compatible scrollTop.
      let scrollTop = (window.pageYOffset !== undefined) ? window.pageYOffset : (document.documentElement || document.body.parentNode || document.body)
        .scrollTop;

      if (breakpoint == 'desktop' || breakpoint == 'full') {
        // if user scrolls to top of target div 
        if (scrollTop >= fixContact.offsetTop) {
          // stick the div
          fixContact.style.position = 'sticky';
          fixContact.style.top = '0';
          fixContact.style.background = '#0f131a';
        } else {
          // release the div
          fixContact.style = '';
        }
      }

    }

  }