How to play gif when it enters the view

Discussion Ask a question
,
1

I made a gif that doesn’t loop.
When I scroll to see the gif, the gif is already played.
How can I delay the start of playing the gif so that the gif will play once when it enters the view?
Thank you!

1 Like
2

You can try making it into a looping gif with a third party like Wix suggest here, so it will still be playing when the user scrolls to it etc. https://support.wix.com/en/article/setting-your-gif-files-to-play-in-a-loop

The other option would be to have it hidden on load until it is needed, then when you either use scrollTo() or onViewportEnter(), you can simply use code to have the image shown which should then start the gif playing.

3

Have the image set to something else initially. I use a single transparent pixel. Once you are ready to show the gif, change the .src property to the gif’s URL and call .show(). This will trigger the animation to start and play once.