Scroll two slides at once

[julianStreibel]

Hi, Im having an issue with scrolling.
When I scroll on my Phone everything works fine.
On my Mac I can't scroll as usually because it scrolls two sides.
When I scroll just very little everything works fine.

[Newbornbird]

I have the same problems!

[VikLiegostaiev]

Hi @julianStreibel what browser did u use? Just tried on mac - everything works fine both in chrome and safari, it scrolls as it should, can u provide the demo screen recording?

[julianStreibel]

This problem occurs both in Firefox and Safari.
Recorded in Firefox.
I use the Trackpad and the Apple Mouse.
I think it works fine when using a mouse with a scroll wheel.
The two last scrolls up were very small scrolls and the first three scrolled two slides each.

[VikLiegostaiev]

@julianStreibel I understood u incorrectly first time. I've renamed the name of the task. Yes, I'm aware of the problem and hadn't solve it yet.

[jf-t]

@VikLiegostaiev The issue is because the scrolling event of a macbook trackpad is over 200 milliseconds, which is what is set as the DEFAULT_ANIMATION_TIMER_BUFFER. I believe there needs to be logic that will stop the default scroll event once the scroll is initiated, so no matter how long it takes the default scroll event to process, it will not jump 2 slides awkwardly.

[floyd-jones]

Any movement on this? Is there a temporary fix in the mean while?

[guigallo]

I'm using this workaround. Blocking scroll up/down onBeforePageScroll and unblocking on pageOnChange.

import { useState } from 'react'
import ReactPageScroller from 'react-page-scroller'

const YouComponent = () => {
  const [blockScroll, setBlockScroll] = useState(false)

  return (
    <ReactPageScroller
      blockScrollUp={blockScroll}
      blockScrollDown={blockScroll}
      onBeforePageScroll={() => setBlockScroll(true)}
      pageOnChange={() => {
        const timeout = setTimeout(() => {
          setBlockScroll(false)
          clearTimeout(timeout)
        }, 750)
      }}
    >
      <Page1 />
      <Page2 />
      <Page3 />
      <Page4 />
    </ReactPageScroller>
  )
}

[Hexi1997]

Any movement on this? Is there a temporary fix in the mean while?