Determine Sticky State in JavaScript - Daine Mawer

determine-sticky-state.js

let stickyElementStyle = null;
let stickyElementTop = 0;

function determineStickyState(element) {

  if (!stickyElementStyle) {
    stickyElementStyle = window.getComputedStyle(element);
    stickyElementTop = parseInt(stickyElementStyle.top, 10);
  }

  const currentTop = element.getBoundingClientRect().top;

  element.classList.toggle('is-sticky', currentTop <= stickyElementTop);

}

window.addEventListener('scroll', throttle(determineStickyState, 200));

throttle.js

export function throttle(func, limit) {
  let inThrottle;
  return function() {
    const args = arguments;
    const context = this;
    if (!inThrottle) {
      func.apply(context, args);
      inThrottle = true;
      setTimeout(() => inThrottle = false, limit);
    }
  };
}