-
-
Notifications
You must be signed in to change notification settings - Fork 35
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat: enhance IsInViewport and useIntersectionObserver #202
base: main
Are you sure you want to change the base?
feat: enhance IsInViewport and useIntersectionObserver #202
Conversation
…control methods - Added methods to IsInViewport class: stop(), pause(), resume(), and isActive to manage the intersection observer. - Updated useIntersectionObserver to include an optional 'once' parameter that stops observing after the first intersection.
|
- Updated the callback function to handle intersection entries more efficiently. - Ensured that the callback is invoked with individual entries
/** | ||
* Stop observing the element. | ||
*/ | ||
stop() { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We'll want to bind these methods to the constructor so they can be used like so:
<button onclick={observer.stop}></button>
Similar to the others we have this way!
built with Refined Cloudflare Pages Action⚡ Cloudflare Pages Deployment
|
…with observer control methods and
once
option.IsInViewport
class:stop()
,pause()
,resume()
, andisActive
to manage the intersection observer.useIntersectionObserver
to include an optional 'once' parameter that stops observing after the first intersection.As i way using
IsInViewport
anduseIntersectionObserver
i often found the need to unobserve on intersecting. Especially for classic fade in animations and so on. Furthermore i was confused that i cant handle theIsInViewport
utility correctly. Therefore i added these two enhancements.Just lmk if that is not desired or if anything is not correctly implemented. I have opted for
once
naming scheme. Alternatives would be:triggerOnce
,unobserveOnEnter
, ...Example: