Skip to content

React hook to synchronise the scroll position of multiple containers.

Notifications You must be signed in to change notification settings

slocka/use-sync-scroll-hook

Repository files navigation

use-sync-scroll-hook

React hook to synchronise the scroll position of multiple containers.

NPM JavaScript Style Guide

Demo

https://slocka.github.io/use-sync-scroll-hook/

Install

npm install --save use-sync-scroll-hook

or

yarn add use-sync-scroll-hook

Usage

import React, { useRef } from 'react'

import useSyncScroll from 'use-sync-scroll-hook'

export default function Example() {
  const headerRef = useRef()
  const bodyRef = useRef()

  useSyncScroll([headerRef, bodyRef])

  return (
    <div className="table">
      <div ref={headerRef} className="table-header">
          ...
      </div>
      <div ref={bodyRef} className="table-body">
        ...
      </div>
    </div>
  )
}

License

MIT © slocka

About

React hook to synchronise the scroll position of multiple containers.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published