Visibility provides a set of callbacks for when a content appears in the viewport.


This section is intended as a reference for specific use cases of components, or compositions of them, that are not covered in the component's default examples.



An example of Visibility.


Fire on mount

Fires callbacks immediately after mount.


Value that context should be adjusted in pixels. Useful for making content appear below content fixed to the page.

Callback frequency

You can change the callback frequency with `once` and `continuous` settings.

Grouped callbacks

You can specify callbacks that occur after different percentages or pixels of an element are passed.

Update on

You can specify updateOn='repaint', it will allow to update and fire callbacks on browser repaint (animation frames).

By default Visibility handles events only on browser events. It means that if you will hide a large block an event will not be triggered and Visibility will not perform calculations. This problem can be easily solved with updateOn='repaint'.
This is the bottom