juliangarnier / anime

JavaScript animation engine
https://animejs.com
MIT License
49.63k stars 3.67k forks source link

Removed animations still seems to complete #650

Open PlopTheReal opened 4 years ago

PlopTheReal commented 4 years ago

Salutations,

I'd like to use the lib to scroll and cancel the scroll animation if the user spam on the buttons that triggers the scrolls or start scrolling with other ways.

I've tried to remove the element but it doesn't seems to work. The only way is to reset the previous animation but I was wondering if that doesn't leak somehow.

code sample:

var prevEl
var prevAnim
var prevcontent
function scrollTo(el, offset, cb) {
    if (!el || prevEl == el) {
        return
    }
    anime.remove(prevcontent) // doesn't seems to work
    if (prevAnim){
        prevAnim.reset() // work to prevent the animation to complete but does it require cleanups?
    }
    prevEl = el
    var offset = offset || 0;
    var content = document.querySelector('.scrollable');
    prevcontent = content
    var scrollAnim = anime({
        targets: { scroll: content.scrollTop },
        scroll: el.offsetTop - offset,
        duration: 3000,
        easing: 'easeOutQuart',
        update: function (a) {
            content.scrollTop = a.animations[0].currentValue;
        },
        complete: function () { 
            console.log("COMPLETE")
            if (cb) cb(); 
        }
    });
    prevAnim = scrollAnim
}

Awesome lib! Regards.

kn0wn commented 4 years ago

Hi @kobsTheReal, intersting use of the library! Could you paste this into a codepen so I can take a better look at what you're trying to achieve?