Playing a Lottie file on a button click

Using JavaScript with Hype
8

Thanks for all your suggestions and pointers Mark. They surely make a lot of sense.

I think I should familiarise myself better with Lottie Files and what interactivity can be added with JS as I'm going to be using them more often from now on.

In the end I went for something like this:

On button mouse over:

hypeDocument.customData.animation.playSegments([0, 101], true)
hypeDocument.customData.animation.setDirection(1);

On button mouse out:

var current_frame = hypeDocument.customData.animation.currentRawFrame
if (current_frame == 100) {
hypeDocument.customData.animation.goToAndPlay(80, true); hypeDocument.customData.animation.setDirection(-1);	
} else {   
hypeDocument.customData.animation.setDirection(-1);	
}

Next step, I'm going to study and understand your solution better so I can implement it in the future.

Thanks again
Greg

1 Like