Hello! I am a novice coder looking for some guidance on how to replay a non-looping gif using Twine 2.3.5 and SugarCube 2.30.0.
The animation must only play once each time the page is loaded so a looping gif will not work in my case.
Thank you.
In my limited experience using GIFs, it would seem if the non-repeat is a function of the file itself, you would need to either clear and re-display that element to make it play again (if Twine allows that in your version) or re-display the entire passage/page again.
Thanks for the advice. I’m not sure how to reload the entire page yet but will look into it.
In Axma I would probably finagle it somehow so the player has to click a link to the same passage to trigger it to play again. There might be a better way, but I’m not good at coding! 
Might want to check here:
Thanks again!
Have you simply tried that?
Normally that wouldn’t work, since not only will the browser cache the image data but the <img> instance will also cache the rendered bitmap, which will be at the last frame of the animation.
In this case, however, by leaving and returning to the passage containing the image a completely new <img> instance is created. I haven’t tested animated images lately, but hopefully that will replay the animation from the first frame.
I’d definitely suggest simply trying that first.
If that doesn’t work consistently in various browsers, then what you’ll have to do is cheat a bit by changing the URL each time the player visits the passage. That’s easier than it sounds, you just need to provide a unique-ish query as part of the URL.
You didn’t offer an example of what you’d already tried, but here’s an example using the [img[]] markup:
[img["images/animated1.gif?" + Date.now()]]
By adding the unique query (?…) to the URL, the browser should reload the image every time since the URL is different every time—even though you’re really referring to the same image file.
Please don’t link to the old Twinery forums. Any advice there will, in general, be years out of date—exactly the case for the linked thread.
1 Like
Tried your example code and the gif reloads every time. Thanks very much for the help.