React Hooks Lab Docz
Getting Starteduse-intersection-observeruse-mouse-positionuse-on-hoveruse-scroll-directionuse-scroll-progressuse-scroll-to-topuse-window-size

use-scroll-progress

Hook Description

0%
import React from "react";
import { useScrollProgress } from "react-hooks-lab";
const ScrollProgress = () => {
  const scrollProgress = useScrollProgress();
  return (
    <>
      <div className="scroll" style={{ width: `${scrollProgress}%` }}></div>
      <div>{scrollProgress}</div>
    </>
  );
};
export default ScrollProgress;