javascriptcssreactjsreact-scroll

React: How to disable clicking while scrolling with react-scroll?

When I click anywhere on the screen during a scroll animation the animation stops. I want to disable this and figured one of the ways would be to make the whole screen unclickable during the scroll. I tried making pointer-events: none onScroll but it didn't work. Any solutions?

Solution

  • use ignoreCancelEvents property:

    <Link 
   activeClass="active" 
   to="secondInsideContainer" 
   spy={true} 
   smooth={true} 
   duration={9250}  
   ignoreCancelEvents={true} // <----- Add this line
   containerId="containerElement" 
>
  Go to second element inside container
</Link>