intersection-observer

There are 9 repositories under intersection-observer topic.

thebuilder / react-intersection-observer
React implementation of the Intersection Observer API to tell you when an element enters or leaves the viewport.
intersectionobserver-api react performance scrolling intersectionobserver monitor visibility viewport lazy-loading hooks hook intersection-observer react-hooks reactjs
Language:TypeScript 4782
wellyshen / react-cool-inview
😎 🖥️ React hook to monitor an element enters or leaves the viewport (or another element).
react hook inview viewport visibility lazy-loading scrolling animations impressions intersection-observer monitor scroll-direction performance typescript component
Language:TypeScript 1461
react-lazy-load-image-component
Aljullu / react-lazy-load-image-component
React Component to lazy load images and components using a HOC to track window scroll position.
hoc intersection-observer intersectionobserver lazy-loading lazyload lazyload-images react react-component react-lazy react-lazy-load react-lazy-module react-performance reactjs server-side-rendering ssr
Language:JavaScript 1362
researchgate / react-intersection-observer
React component for the Intersection <Observer /> API
react intersection-observer viewport impressions scrolling
Language:JavaScript 1111
morellodev / react-awesome-reveal
React components to add reveal animations using the Intersection Observer API and CSS Animations.
reatctjs typescript javascript web intersection-observer css css-animations hooks reveal animations effects emotion css-in-js react chaining-multiple-animations add-reveal-animations react-components viewport emotionjs animation
Language:TypeScript 1048
wellyshen / react-cool-img
😎 🏞 A React <Img /> component let you handle image UX and performance as a Pro!
react ui img placeholder lazy-loading auto-retry component intersection-observer performance-optimization ssr ux seo typescript
Language:TypeScript 781
ngx-quicklink
mgechev / ngx-quicklink
Quicklink prefetching strategy for the Angular router
performance prefetch speed intersection-observer angular
Language:TypeScript 742
maciekgrzybek / svelte-inview
A Svelte action that monitors an element enters or leaves the viewport.🔥
hacktoberfest svelte observer intersectionobserver intersection-observer javascript intersectionobserver-api svelte3 svelte-js svelte-component viewport typescript
Language:TypeScript 727
jsonkao / react-scrollama
Simple scrollytelling with the IntersectionObserver in React.
scrollytelling react intersection-observer
Language:JavaScript 375
roderickhsiao / react-in-viewport
Detect if React component is in viewport
intersection-observer react viewport lazyload
Language:TypeScript 335
metonym / svelte-intersection-observer
Detect if an element is in the viewport using the Intersection Observer API
intersection-observer viewport lazy-loading conditional svelte svelte-component typescript-definitions intersection-event
Language:Svelte 306
defer.js
shinsenter / defer.js
🥇 A lightweight JavaScript library that helps you lazy load (almost) anything. Defer.js is dependency-free, highly efficient, and optimized for Web Vitals.
vanillajs lazysizes deferjs intersection-observer srcset lazyload lazyloader scroll-reveal unveil vanilla-lazyload lazy-audio lazy-css lazy-iframe lazy-image lazy-javascript lazy-js lazy-picture lazy-stylesheet lazy-video microjs
Language:JavaScript 269
fpapado / react-lazy-images
🖼️ 🛋️ Components and utilities for lazy image loading in React
lazy-loading images component react intersection-observer
Language:TypeScript 264
codrops / ScrollingLettersAnimation
A switching title effect where a fixed element changes depending on the scroll position.
animation intersection-observer scrolling css typography effect javascript
Language:HTML 226
k3nsei / ng-in-viewport
Allows us to check if an element is within the browsers visual viewport
intersection-observer angular ng viewport visibility lazy-loading lazyload lazyload-images infinite-scroll angular-10 angular-11 angular-12 hacktoberfest angular-13 angular-14 angular-15 angular-16 angular-17
Language:TypeScript 214
rdmurphy / scroller
📜 A super-tiny library for your scrollytelling needs.
intersection-observer scroller scrollytelling
Language:JavaScript 178
intersection-observer
ng-web-apis / intersection-observer
A library for idiomatic use of IntersectionObserver with Angular
intersection-observer intersectionobserver intersectionobserver-api intersection
Language:TypeScript 155
zeusdeux / use-is-in-viewport
A react hook to find out if an element is in a given viewport with a simple api.
react hooks react-hooks intersection-observer viewport
Language:JavaScript 152
researchgate / react-intersection-list
React infinite scroll using the Intersection <Observer /> API
infinite-scroll list intersection-observer react
Language:JavaScript 140
pomber / intersection-observer-debugger
A script you include during development that shows the root, target, and intersection every time an IntersectionObserver is triggered.
intersection-observer debugger visualizer
Language:JavaScript 119
cats-oss / use-intersection
React Hooks for IntersectionObserver.
react reactjs react-hooks intersection-observer
Language:TypeScript 108
tudorgergely / use-scroll-to-bottom
React Hook which tells you when you've scrolled to bottom
react bottom intersection-observer typescript react-hooks
Language:JavaScript 107
BKWLD / vue-in-viewport-mixin
Vue 2 mixin to determine when a DOM element is visible in the client window
vue viewport scrolling mixin intersection-observer
Language:JavaScript 101
zhbhun / react-native-intersection-observer
React Native component that monitors when an element enters or leaves the client viewport.
react react-native lazy-loading lazyload lazyload-images intersection-observer
Language:TypeScript 88
bitmap / react-hook-inview
React hook for detecting when an element is in the viewport
react-hook intersection-observer viewport
Language:TypeScript 86
cesarolvr / murphyjs
A simple way to implement scroll based reveal animations in your site.
css smooth-scrolling motion intersection-observer scroll-events animation webanimation-api
Language:JavaScript 80
jesusbotella / ngx-lazy-load-images
Image lazy load library for Angular 2+
lazy-loading angular angular2 angular4 intersection-observer mutationobserver lazy-load images intersectionobserver angularuniversal angular9 angular10 angular11
Language:TypeScript 80
vivaxy / impression
👀Element view notifier
npm-package impression advertising onscreen viewable tracking intersection-observer
Language:JavaScript 78
openfresh / viewport-observer
React Component that observe changes in the intersection of a target element with viewport using IntersectionObserver
intersection-observer react viewport
Language:JavaScript 67
onderonur / react-intersection-observer-hook
React hook to use IntersectionObserver declaratively.
react-hooks visibility typescript react intersection-observer intersectionobserver reactjs
Language:TypeScript 65
Niresh12495 / LazyHTML
LazyHTML is an OpenSource Javascript Library that Supports Lazy Loading of any elements without Modifying Code, LazyHTML can lazy load Ads, Videos, Images, Widgets, Javascript, CSS, Inline-Javascript, Inline-CSS & Any HTML.
lazyload intersection-observer lazyload-ads asynchornous asychronous-loading lazyload-widgets lazyload-elements lazyload-javascript lazyload-css lazy-load-adsense core-web-vitals
Language:JavaScript 52
martinlaxenaire / scroll-observer
Really simple Intersection Observer helper
intersection-observer intersectionobserver-api javascript vanilla-javascript
Language:JavaScript 47
shinsenter / defer.php
🚀 A PHP library that focuses on minimizing payload size of HTML document and optimizing page speed.
lazyload lazy-loading lazy-loader lazy-js lazy-css lazy-image lazy-iframe lazy-video lazy-ads lazy-img composer-package efficient performant pagespeed website-performance avoid-render-blocking browser-compatibility intersection-observer browser-perf defer-js
Language:PHP 40
beyonk-group / svelte-scrollspy
Scroll Spy component for Svelte
svelte scrollspy intersection-observer scroll beyonk svelte-v3
Language:JavaScript 38
BiYuqi / vue-intersection-observer
Vue component for the Intersection <Observer /> API
intersection-observer intersectionobserver intersectionobserver-api vue2 vue-intersection-observer vue-component
Language:Vue 34
snewcomer / intersection-observer-admin
Intersection Observer Admin for better performance
intersection-observer intersectionobserver-api performance lazy-loading lazyload-images
Language:TypeScript 34

intersection-observer

thebuilder / react-intersection-observer

wellyshen / react-cool-inview

Aljullu / react-lazy-load-image-component

researchgate / react-intersection-observer

morellodev / react-awesome-reveal

wellyshen / react-cool-img

mgechev / ngx-quicklink

maciekgrzybek / svelte-inview

jsonkao / react-scrollama

roderickhsiao / react-in-viewport

metonym / svelte-intersection-observer

shinsenter / defer.js

fpapado / react-lazy-images

codrops / ScrollingLettersAnimation

k3nsei / ng-in-viewport

rdmurphy / scroller

ng-web-apis / intersection-observer

zeusdeux / use-is-in-viewport

researchgate / react-intersection-list

pomber / intersection-observer-debugger

cats-oss / use-intersection

tudorgergely / use-scroll-to-bottom

BKWLD / vue-in-viewport-mixin

zhbhun / react-native-intersection-observer

bitmap / react-hook-inview

cesarolvr / murphyjs

jesusbotella / ngx-lazy-load-images

vivaxy / impression

openfresh / viewport-observer

onderonur / react-intersection-observer-hook

Niresh12495 / LazyHTML

martinlaxenaire / scroll-observer

shinsenter / defer.php

beyonk-group / svelte-scrollspy

BiYuqi / vue-intersection-observer

snewcomer / intersection-observer-admin