Newlywed Party Monsters

    smooth-anchorate

    1.2.1 • Public • Published

    smooth anchorate

    Smooth Scroll to anchor links.

    Smooth Scroll to anchor links with client-side routes e.g. with history's listen, React Router's onUpdate, or Gatsby's onRouteChange. Register a listener to call this and when window.location.hash isn't empty, it'll scrollIntoView first matching element by id or name per spec.

    Originally based on: https://github.com/reactjs/react-router/issues/394#issuecomment-220221604

    Install

    npm install --save smooth-anchorate
    

    Use

    history

    import { smoothAnchorate } from 'smooth-anchorate'
    import { createHistory } from 'history'
     
    const history = createHistory()
    
    history.listen(() => {
      smoothAnchorate()
    })

    React Router

    import { smoothAnchorate } from 'smooth-anchorate'
    import { render } from 'react-dom'
    import { Router, browserHistory } from 'react-router'
    
    function onUpdate () {
      smoothAnchorate()
    }
    
    // ...
    
    render((
      <Router
        onUpdate={onUpdate}
        history={browserHistory}
      />
    ), document.getElementById('app'))

    Gatsby

    In gastby-browser.js:

    import { smoothAnchorate } from 'smooth-anchorate'
    
    exports.onRouteChange = () => {
      smoothAnchorate()
    }

    Keywords

    none

    Install

    npm i smooth-anchorate

    DownloadsWeekly Downloads

    4

    Version

    1.2.1

    License

    ISC

    Last publish

    Collaborators

    • juancr11