amorriscode / use-overflow

A React Hook that allows you to detect X and Y overflow

Home Page:https://amorriscode.github.io/use-overflow/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

use-overflow

A React Hook that allows you to detect X and Y overflow.

NPM JavaScript Style Guide

Install

npm install --save use-overflow
OR
yarn add use-overflow

Usage

Check out the live example.

import * as React from 'react'

import { useOverflow } from 'use-overflow'

const Example = () => {
  const horizontalRef = React.useRef(null);
  const { refXOverflowing, refXScrollBegin, refXScrollEnd } = useOverflow(horizontalRef);

  const verticalRef = React.useRef(null);
  const { refYOverflowing, refYScrollBegin, refYScrollEnd } = useOverflow(verticalRef);

  return (
    <div>
      {/* Conditional do stuff based on overflow! */}
    </div>
  )
}

License

MIT © amorriscode


This hook is created using create-react-hook.

About

A React Hook that allows you to detect X and Y overflow

https://amorriscode.github.io/use-overflow/

License:MIT License


Languages

Language:JavaScript 41.8%Language:TypeScript 35.9%Language:CSS 17.5%Language:HTML 4.8%