Как сделать вот такую анимацию?

Question

[Влад Васинев]

Как сделать вот такую анимацию при скролле страницы? Ссылка (комочки бумаги). Возможно ли это реализовать, используя GSAP и ScrollMagic(если да, то как=))?

Answer 1

[its2easyy]

Для привязки к скролу gsap scrolltrigger (это современная версия ScrollMagic), для переключения кадров можно взять animate-images.
Будет примерно так:

let animationState = { frame: 1 };
let animateImagesInstance = new AnimateImages(canvasElement, {
        images: arrayWithImages,
        preload: "all",
    });
let timeline = gsap.timeline({
        scrollTrigger: {
            trigger: triggerBlock,
            start: "top top",
            end: 2000,
            scrub: true,
        }
 });
timeline.to(animationState, { 
        frame: arrayWithImages.length,
        onUpdate: function(){
           animateImagesInstance.setFrame(Math.round(animationState.frame));
       }
});