mirror of
https://github.com/webslides/WebSlides.git
synced 2025-08-21 04:12:01 +02:00
Fixing the scroll function and adding docs
This commit is contained in:
@@ -29,21 +29,37 @@ function getScrollableContainer() {
|
||||
return scrollableContainer;
|
||||
}
|
||||
|
||||
/**
|
||||
* Smoothly scrolls to a given Y position using Easing.Swing. It'll run a
|
||||
* callback upon finishing.
|
||||
* @param {number} y Offset of the page to scroll to.
|
||||
* @param {number} duration Duration of the animation. 500ms by default.
|
||||
* @param {function} cb Callback function to call upon completion.
|
||||
*/
|
||||
function scrollTo(y, duration = 500, cb = () => {}) {
|
||||
const scrollableContainer = getScrollableContainer();
|
||||
const delta = y - scrollableContainer.scrollTop;
|
||||
const increment = 20;
|
||||
const startLocation = scrollableContainer.scrollTop;
|
||||
const increment = 16;
|
||||
|
||||
if (!duration) {
|
||||
scrollableContainer.scrollTop = y;
|
||||
cb();
|
||||
return;
|
||||
}
|
||||
|
||||
const animateScroll = elapsedTime => {
|
||||
elapsedTime += increment;
|
||||
const percent = elapsedTime / duration;
|
||||
const percent = Math.min(1, elapsedTime / duration);
|
||||
const easingP = Easings.swing(
|
||||
percent,
|
||||
elapsedTime * percent,
|
||||
y,
|
||||
delta,
|
||||
duration);
|
||||
|
||||
scrollableContainer.scrollTop = Easings.swing(
|
||||
percent,
|
||||
elapsedTime * percent,
|
||||
y,
|
||||
delta,
|
||||
duration) * delta;
|
||||
scrollableContainer.scrollTop = Math.floor(startLocation +
|
||||
(easingP * delta));
|
||||
|
||||
if (elapsedTime < duration) {
|
||||
setTimeout(() => animateScroll(elapsedTime), increment);
|
||||
|
Reference in New Issue
Block a user