Skip to content

mehdibalouchi/react-scrollspy

 
 

Repository files navigation

react-scrollspy

npm version travis dependencies DevDependencies License

Scrollspy component

Install

$ npm i react-scrollspy

Usage

var Scrollspy = require('react-scrollspy').Scrollspy;

...

<div>

  <div>
    <section id="section-1">section 1</section>
    <section id="section-2">section 2</section>
    <section id="section-3">section 3</section>
  </div>

  <Scrollspy items={ ['section-1', 'section-2', 'section-3'] } currentClassName="is-current">
    <li><a href="#section-1">section 1</a></li>
    <li><a href="#section-2">section 2</a></li>
    <li><a href="#section-3">section 3</a></li>
  </Scrollspy>

</div>

Props

items={Array}

The id list of target contents.

currentClassName={String}

The class name that apply to the navigation element paired with the content element in viewport.

Development

$ git clone https://github.com/makotot/react-scrollspy.git
$ cd react-scrollspy
$ npm i
$ npm run start

Contributing

Pull requests and Reporting a issue are always welcome :)

License

MIT

Packages

No packages published

Languages

  • JavaScript 79.4%
  • CSS 10.9%
  • HTML 6.5%
  • Shell 3.2%