airbnb / lottie-web

Render After Effects animations natively on Web, Android and iOS, and React Native. http://airbnb.io/lottie/
MIT License
30.38k stars 2.87k forks source link

Lottie Interactivity - image sequence flickering #2488

Closed thepagemaster closed 3 years ago

thepagemaster commented 3 years ago

HI ! I just discover this amazing librarie that is bodymovin. As a motion designer i find it very useful. but i have to admit i have a little issue with the lottie-player and lottie Interactivity.

let me explain I'm trying to use the lottie-player with the 'scroll' mode. Everything work fine but, when i wan to use an image sequence. The player flicker (glitch) when i scroll for the first time.

If i have understand the problem correctly, it come from the frame rate of the lottie player.

And to correct that i have to use the method 'setsubframe' to use the initial frame rate of the AE composition.

But to be honest I don't know how i suppose to use it in this case with lottie interactivity. you can find an exemple of my problem at this link: https://aurelien-lepage.com/FILES/2021/index.html

and this is the script it use : ` LottieInteractivity.create({

            mode: "scroll",
            player: '#bureauScroll', 
            loop : false,
            actions: [{
                visibility: [0, 1],
                type: "seek",
                frames: [0, 73]
            }]
        })

` I don't know if i have explain clearly my problem, if you have any question i will be happy to answer it thank you for your time. (sorry for my english...)

thepagemaster commented 3 years ago

if anyone have the same problem, I have find a work around with scrollmagic and jquery this is an example :

div="trigger" div="piscine"