Examples

Welcome to the code examples section!

Here you'll find usage examples and recipes. For a full list of examples, take a look in our storybook page.

• Basic usage on Window
• Usage within a scroller/frame
• Using thresholds
• Using the rootMargin option
• Unobserving the target after an intersection

Recipes

Here you will find useful code snippets to common situations that can be approached with ReactIntersectionObserver:

• Higher Order Component
• Tracking Ad Impressions
• Viewable Monitor
• Graceful Degradation

Can I submit a new recipe?

Yes, of course!

1. Fork the code repo.
2. Create your new recipe in the correct subfolder within docs/docs/components/ (create a new folder if it doesn't already exist).
3. Make sure you have included a README as well as your source file.
4. Submit a PR.

If you haven't yet, please read our contribution guidelines.

What license are the recipes released under?

By default, all newly submitted code is licensed under the MIT license.

How else can I contribute?

Recipes don't always have to be code - great documentation, tutorials, general tips and even general improvements to our examples folder are greatly appreciated.