Feature Request: scrollTo duration / ease

[richard-unterberg]

Hey, thanks for the great plugin.

It would be nice to have access to params like duration and easing of the asscroll.scrollTop() method.

In the meantime I´m curious to know about if it is possible to override the scrollTo method with gsap´s "scrollTop" or "y"-tweens. I´ve tried the following which is not working as expected (nothing happens until the delayed call enables assccroll and hard resets to top after 4 seconds):

function scroll_top() {
    asscroll.disable({
        inputOnly: true
    })

    // "#smooth-scroll-inner" is the asscroll - element which moves vertically
    gsap.to('#smooth-scroll-inner', {
        duration: 4,
        y: 0,
        ease: default_ease_in,
    });

    gsap.delayedCall(4, function() {
        ScrollTrigger.refresh();
        asscroll.enable({reset: true});
    });
}

[ashthornton]

Hey @richard-unterberg, I think the issue with your code there is that you're trying to animate the page element without telling ASScroll you are doing so. Check this issue for an idea of how you might achieve this: https://github.com/ashthornton/asscroll/issues/25#issuecomment-744319156

An updated version of that solution would be:

const scroll = { value: 0 }

function scrollToSection(targetPosition) {
    scroll.value = asscroll.currentPos

    asscroll.disable({ inputOnly: true })

    gsap.to(scroll, {
        value: targetPosition, // targetPosition being the pixel position of where to scroll to
        duration: 1,
        ease: 'expo.out',
        onUpdate: () => {
            asscroll.scrollTo(scroll.value)
        },
        onComplete: () => {
            asscroll.enable()
        }
    })
}

[ashthornton]

In terms of adding the feature within ASScroll to control the duration and ease of the scrollTo() function, I don't think it's something I would add because it would mean adding in a large list of all possible easings and changing the way smooth scroll works just for this one instance. It is designed to be minimal in order to closer match the native window.scrollTo() functionality.

[richard-unterberg]

Hey Ash, thanks for the fast answer. This works perfectly.