Skip to main content

BehaviorSticky

This component helps in the implementation of sticky components

Installation​

$ npm install @s-ui/react-behavior-sticky --save

Usage​

import BehaviorSticky, {
  BehaviorStickyProvider
} from '@s-ui/react-behavior-sticky'

Basic usage (Fixed at top)​

  <BehaviorStickyProvider>
    ...
    <BehaviorSticky>
      <HeaderFixed />
    </BehaviorSticky>
    ...
  </BehaviorStickyProvider>

Sticky per container​

  <BehaviorStickyProvider>
    ...
    <div ref={container1}>
      <BehaviorSticky container={container1} defaultOffsetTop={45} animate>
        <HeaderWithButtons className={CLASS_DEMO_FIXED_BUTTONS} />
      </BehaviorSticky>
      <Content className={CLASS_DEMO_CONTENT} />
    </div>
    ...
  </BehaviorStickyProvider>

Find full description and more examples in the demo page.