How to stop Javascript Animation?

Question

JavaScript

Guys, such a problem. I made an animation (it's only necessary because I have it, it's impossible through css). Everything works, but you need to somehow stop the fade function, so that the animation does not constantly occur, but only once. I use clearInterval, but it doesn't work, as I understand it, because of the scope. But I can't figure out how to fix it.. https://jsbin.com/neyapet/edit?html,css,js,output

Answer 1

add more conditions...

if (window.pageYOffset < headerBottom) {
        header.classList.remove('sticky');
        flag = true; // это 
    } else if (window.pageYOffset > headerBottom && flag) { // и здесь еще && flag
        header.classList.add('sticky');
        fade(header, 2000, 50);
        flag = false;
    }