react-sticky-box

Boxes that behave nicely while scrolling

ISC 54 个版本

react scroll sticky fixed

主页

仓库

提交 Issue

安装

npm install react-sticky-box

yarn add react-sticky-box

pnpm add react-sticky-box

bun add react-sticky-box

README

Version Downloads/Week Minified Bundlesize Minified Gzipped Bundlesize

React Sticky Box

Sticky Boxes with sensible behaviour if the content is bigger than the viewport.

Documentation & Demo

react-sticky-box.codecks.io

Quick Start

Use as a Component

import StickyBox from "react-sticky-box";

const Page = () => (
  <div className="row">
    <StickyBox offsetTop={20} offsetBottom={20}>
      <div>Sidebar</div>
    </StickyBox>
    <div>Content</div>
  </div>
);

Or via the `useStickyBox` hook

import {useStickyBox} from "react-sticky-box";

const Page = () => {
  const stickyRef = useStickyBox({offsetTop: 20, offsetBottom: 20})
  <div className="row">
    <aside ref={stickyRef}>
      <div>Sidebar</div>
    </aside>
    <div>Content</div>
  </div>
};

Changelog

Contribute

checkout the repo
cd /path/to/repo/packages/docs
yarn install && yarn start

this will allow you to modify the react-sticky-box sources in packages/react-sticky-box/src and check the effects in the docs.

版本列表

2.0.5 2023-10-23

2.0.4 2023-04-14

2.0.3 2023-04-14

2.0.2 2023-04-13

2.0.1 2023-04-13

2.0.0-0 2023-02-05

2.0.0 2023-02-06

1.0.2 2022-04-06

1.0.1 2022-03-19

1.0.0 2022-03-06

1.0.0-next.1 2022-03-06

1.0.0-next.0 2022-03-06

0.9.3 2020-02-19

0.9.2 2019-12-02

0.9.1 2019-11-25

0.9.0 2019-11-25

0.8.0 2019-01-14

0.7.8 2019-01-07

0.7.7 2018-12-23

0.7.6 2018-12-02

0.7.5 2018-10-24

0.7.4 2018-10-20

0.7.3 2018-10-19

0.7.2 2018-10-17

0.7.1 2018-10-16

0.7.0 2018-09-28

0.6.4 2018-08-13

0.6.3 2018-08-07

0.6.2 2018-04-03

0.6.1 2017-07-12

0.6.0 2017-07-12

0.5.9 2017-07-07

0.5.8 2017-07-07

0.5.7 2017-05-20

0.5.6 2017-03-14

0.5.5 2017-03-01

0.5.4 2017-03-01

0.5.3 2017-02-28

0.5.2 2017-02-28

0.5.1 2016-11-16

0.5.0 2016-11-10

0.4.9 2016-09-29

0.4.8 2016-07-04

0.4.7 2016-07-04

0.4.6 2016-03-21

0.4.5 2016-02-18

0.4.4 2016-02-16

0.4.3 2016-02-15

0.4.2 2016-02-15

0.4.1 2016-02-15

0.4.0 2015-11-04

0.3.3 2015-09-09

0.3.2 2015-06-08

0.3.1 2015-06-08