Hi, does anyone know why lottie interactivity scroll is not working. I have it working in a plain react app, but in F7 it does not work. I think it has to do with the Page compnent.
Can you share a sandbox link?
If only I knew how to upload a lottie json file to codesandbox?
Best I can do is the code:
import smileEmoji from "../../assets/lotties/emoji/smile.json";
const style = {
height: 300,
border: 3,
borderStyle: "solid",
borderRadius: 7,
};
const Example = () => {
const lottieObj = useLottie({
animationData: smileEmoji,
onScroll: (e) => console.log(e)
}, style);
const Animation = useLottieInteractivity({
lottieObj,
mode: "scroll",
actions: [
{
visibility: [0, 0.45],
type: "stop",
frames: [0],
},
{
visibility: [0.45, 1.0],
type: "seek",
frames: [0, 140],
},
],
});
return Animation;
};
const TestPage = () => {
return <Page>
<Navbar title="Test stuff" backLink="Back" />
<div style={{ height: 800 }}></div>
<Example />
<div style={{ height: 800 }}></div>
</Page>;
}