Play animation on viewport

Hi,

Thank you for using the plugin – hope you like it!

Thank you, that’s a good idea. Will add it in the next update.

thanks for your reply @johanaarstein , also I find an other problem on the plugin, the .lottie animations are not played correctly , for example I have an animation with PNG files inside it , the text and animations are played but images are not displayed!! and when I open console log a 404 error images not found in the URL of current page permalink!! could you please check this error too ??

Also if you could add an option to hide the animation after it complete playing I dont know mabe by applying “Display:none” or “opacity:0” , the idea is I want to play 2 animations at the same time and hide 1 of them when it complete playing :

for example : I have (intro.lottie) and (loop.lottie) , I will display them on top of each other using z-index , but I want to hide the (intro.lottie) when it complete playing to keep only (loop.lottie) only is displayed

I hope you understand me and thankyou very much for your plugin

• This reply was modified 1 year, 7 months ago by zmayyem.

Aha, I hadn’t noticed that – thanks again!

In the latest version I’ve added an option to play on viewport visibility, and I’ve also fixed the issue you pointed out concerning bitmap assets in dotLottie files.

The other feature request I’ll consider adding, but in the meantime you could achieve the effect you want with JavaScript, by adding an event listener to the animation you want to hide like so:

const yourAnimation = document.querySelector('#your-id');
yourAnimation.addEventListener('complete', () => yourAnimation.style.display = 'none');

Good luck, and let me know if you discover any other bugs! ??

@johanaarstein , sorry for the late reply , I didn’t notice the updated version, as well your solution using javascript work perfectly,

thankyou very much for your support ?? ??