Having Problems with LottieFiles Interactivity

Need help
1

I encountered two issues when I tried to use Lottie files with interactions:

Issue 1: When I add the lottie animation file in an HTML element, Lottie animation works perfectly, but it doesn’t seem to work when I add the Lottie interactivity package.

<script src="https://unpkg.com/@lottiefiles/lottie-interactivity@latest/dist/lottie-interactivity.min.js"></script>

Issue 2: When I change the HTML element to display as an iframe the interaction works, but when I click the HTML element it does not trigger the parent group’s workflow.

Is there any way to make the Lottie interaction work and trigger parent groups workflow at the same time.

HTML element code:

 <script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
<script src="https://unpkg.com/@lottiefiles/lottie-interactivity@latest/dist/lottie-interactivity.min.js"></script>
    <lottie-player id="toggleLottie" src="https://assets6.lottiefiles.com/packages/lf20_nec2bc6i.json" style="width:40px; height: 40px;"></lottie-player>
<script>
document.addEventListener("DOMContentLoaded", (e) =>{
    console.log(LottieInteractivity)
    console.log(document.getElementById("toggleLottie"))
    LottieInteractivity.create({
    player:'#toggleLottie',
    mode:"cursor",
    actions: [
        {
            type: "toggle"
        },
]
});
</script>
2

This topic was automatically closed after 70 days. New replies are no longer allowed.