@beskar-labs/use-sticky v2.0.5

useSticky

useSticky is a tiny, zero-dependency SSR-friendly hook for tracking element sticky state. It implements a hack of margin-top: -1px to detect when an element is stuck to the top of the viewport and returns a boolean value.

Installation

yarn add @beskar-labs/use-sticky

Usage

import { useSticky } from '@beskar-labs/use-sticky';

const App = () => {
  const ref = useRef(null);
  const isSticky = useSticky(ref);

  return (
    <div ref={ref}>
      <p>Is sticky? {isSticky ? 'Yes' : 'No'}</p>
    </div>
  );
};