-
Notifications
You must be signed in to change notification settings - Fork 0
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
Needs support for more easing functions. #5
Comments
Hmm, thats not a bad idea and it'd be pretty simple to add. right now the new scroll position is totally calculated with y = mx + b, we could definitely add some quadratic or higher order acceleration / deceleration. You can see what i'm using this for by heading to an archive page and clicking a new archive from the grid at the bottom of the page. Linear does seem a little jarring... You're welcome to submit a PR if you have something particular in mind. Otherwise I probably won't get to this until it becomes a bit higher priority or if i implement scroll-to elsewhere But if nothing else, we should make it clear via readme what type of function (linear at the moment) this module uses to calculate scroll position given a progress percentage |
Anyone have a proposed api? I think this would be a good addition. |
usage scrollTo({
x: 0,
y: 0,
type: 'decelerate'
}); implementation window.scroll(calculateScrollPos({/*pass in x data including current position*/}), calculateScrollPos({/*pass in y data*/}));
//...
function calculateScrollPos (opts) {
switch (opts.type) {
case 'decelerate': // start fast, but decelerate quadratically
return= -x^2 + b // or something
case 'ease':
// return -(x-.5)^2 + b // idk this is some oldschool math, but shift the parabola over a bit so scrolling accelerates until progress is 0.5 then decelerates
default:
// linear, same as current impl
return = mx + b
}
} |
although i feel like we will decide that a certain type looks nice just use that for everything |
So this builds the easing into this package. I think a better method would be to provide an easing function where you provide |
ah i see, you pass your own yeah that's definitely better |
although if you're using scrollTo all over your app (this module will certainly blow up in popularity, just give it time) and you decide that a particular scrolling animation is a signature style of your app (maybe we should wiggle as we scroll?!), you'll have to pass in your equation every time you call scrollTo. I guess that's okay though. scrollTo({type: 'wiggle'}) isn't much better than passing in your wiggle function every time, especially considering the loss of customizability. i'd just be a little frustrated if i was reading the docs of an animation library and it said |
What about adding a way to configure defaults? Either that or you have to do is wrap this module in your own little custom wrapper. |
Saw that this only supports linear easing.
Would love to add support for more robust easing options.
The text was updated successfully, but these errors were encountered: