Lottie scroll relative to container

There may be situations where you would like to wrap the lottie player inside a container or just in general sync the lottie scroll with a div on your page. In which case you may pass a container variable with the container id into the action object.
This containers ID is "MyContainerId". The scroll activates in this example once the container with "MyContainerId" is in the viewport.

<script>
LottieInteractivity.create({
    player: "#secondLottie",
    mode:"scroll",
    container: "#my-container",
    actions: [
        {
            visibility: [0, 1.0],
            type: 'seek',
            frames: [90, 123],
        },
    ]
});
</script>
    



Updated

Was this article helpful?

0 out of 0 found this helpful

Have more questions? Submit a request

Comments

0 comments

Article is closed for comments.