some-react-components / react-scrollchor

A React component for scroll to `#hash` links with smooth animations
ISC License
149 stars 24 forks source link

How do you actually use a custom easing function? #41

Closed joshuatuscan closed 3 years ago

joshuatuscan commented 3 years ago

I'd like to use a different easing function than the default, but can't figure how you actually pass through a new easing function in a way that Scrollchor will accept without an error.

SeinopSys commented 3 years ago

I believe the current implementation of easing does not provide the correct arguments for the custom easing function, this is one of the things I tried to address in my PR #40. If you need custom easing support right now I suggest trying out my fork of this package, @seinopsys-forks/react-scrollchor, otherwise you can wait until the PR is accepted.

joshuatuscan commented 3 years ago

I think it'd be a great idea to make the default easing be something a little more straightforward, less opinionated, something like (easeOutSine)[https://easings.net/#easeOutSine].

For now tho, it would be great to just get an example of how to format for say Linear easing so that it can be passed through the Animation property and work with current code.

SeinopSys commented 3 years ago

I honestly have no clue what sort of arcane magic is powering the implementation in its current form, I know I specifically adjusted my fork because I could not figure this out and wanted to use a more "standard" approach. The PR has sources for two basic easings here: https://github.com/SeinopSys/react-scrollchor/blob/v7/src/easing.ts

These are basically taken verbatim from the jQuery easing library and I'm confident you could plug any of the other easings from it in there and it will work.

bySabi commented 3 years ago

@joshuatuscan @SeinopSys sorry for the delay!

What I did, for the "deprecated" implementation, was copy and paste the easing function from here: https://github.com/danro/jquery-easing/blob/master/jquery.easing.js although that no longer matters because @SeinopSys has improved it a lot

Version 7.0.0 of this package had bee release with @SeinopSys PR's who did a wonderful job cleaning this module.

Now it seems that everything is in its place.

bySabi commented 3 years ago

I thiks is already solved.

Feel free to reopen it if needed