captivationsoftware/react-sticky

Feature- Request: Allow listening on `onScroll` event

Closed this issue · 2 comments

I'm submitting a ...

  • bug report
  • feature request
  • support request

What is the current behavior?

<StickyContainer onScroll={handleScroll}/>

handleScroll is not called

What is the expected or desired behavior?

That handleScroll will be called.

Why do you want this? What use case do you have?

In My use-case there is a component out-side the <StickyContainer/> (A Page Header) which reacts (gets minimized) is when on a specific scrollTop value (Unrelated to the stickiness).

Workaround

I am able to subscribe to <StickyContainer/> event using the instance method subscribe.
But it handles all event types:

events = [
    "resize",
    "scroll",
    "touchstart",
    "touchmove",
    "touchend",
    "pageshow",
    "load"
  ];

And I would like to handle only the onScroll.
Maybe we should just add the actual event object in the handler's argument, e.g.:

handler({
            distanceFromTop: top,
            distanceFromBottom: bottom,
            eventSource: currentTarget === window ? document.body : this.node,
            event: evt
          })

What is your environment?

Is there anything else I should know?

It's a simple PR.
I guess all event could be "open" for consumers. (Not just onScroll)

vcarl commented

Does window.addEventListener('scroll', handleScroll) work for you? Typically you don't attach scroll handlers to a specific node in my experience.

Adding an event listener to the window does not work for every use case, for example in the case of a container with an overflow, the window's scroll event is not called