Skip to content
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

[Enhancement] Smooth scrolling when calling a "scroll" function #20

Open
Rechdan opened this issue Oct 25, 2021 · 3 comments · May be fixed by #21
Open

[Enhancement] Smooth scrolling when calling a "scroll" function #20

Rechdan opened this issue Oct 25, 2021 · 3 comments · May be fixed by #21

Comments

@Rechdan
Copy link

Rechdan commented Oct 25, 2021

Right now the scrollbar jumps toward were we ask it to go, but would be great an option that let us make this a smooth animation.

@RobPethick
Copy link
Owner

RobPethick commented Nov 8, 2021

Can you share an example so I can see how you are scrolling?

@rmatesicZavy
Copy link

I'm trying to do the same thing. I created a ref and a basic button to scroll from the top by 200. This was based off the documentation.

https://github.com/RobPethick/react-custom-scrollbars-2/blob/master/docs/API.md#methods

However when performing the scroll, it just jumps to that location without doing a smooth transition. Any way to be able to handle a smooth transition?

const scrollerRef = React.useRef();
 <Scrollbars
     ref={(ref) => (scrollerRef.current = ref)}
     ...
     
 <Button
    onClick={() => {  
        scrollerRef.current.scrollTop(200);
   }} >
   Scroll Down
</Button>    

@fourjr fourjr linked a pull request Dec 14, 2021 that will close this issue
@fourjr
Copy link

fourjr commented Dec 14, 2021

Hey, I implemented this in my branch. You can install it by doing npm uninstall react-custom-scrollbars-2 && npm install fourjr/react-custom-scrollbars-2#59505ce53d3ca0e77fa715ff44274dee069eef98.

scrollToTop('smooth') or scrollTop(200, 'smooth') should work then.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants