Search
Affix

Wrap Affix around another component to make it stick the viewport.

Affix

When to use

On longer web pages, its helpful for some content to stick to the viewport. This is common for menus and actions.
Please note that Affix should not cover other content on the page, especially when the size of the viewport is small.


Basic

The simplest usage.

Callback

Callback with affixed state.

Container to scroll

Set a target for 'Affix', which is listen to scroll event of target element (default is window).

API

PropertyDescriptionTypeDefault
offsetBottom
Offset from the bottom of the viewport (in pixels)
number
-
offsetTop
Offset from the top of the viewport (in pixels)
number
0
target
Specifies the scrollable area DOM node
() => HTMLElement
() => window
onChange
Callback for when Affix state is changed
Function(affixed)
-