As many of you know, most responsive web designs, and most startup screens on abs, now include HD animated GIFs. I have been trying to add, import, create, or marginally make this happen within my prototype. However, I get the first frame, the first frame only, and nothing I can do will instantiate the animation.
I apologize for the remedial questions; I am a software engineer trying to illustrate a point, rather than spending days or weeks writing the actual code, just to have someone be fussy about it later. lol
The GIF is included in the page as soon as it is loaded and will immediately play whether or not it is visible to the user. Is the GIF visible on load of the page or are you hiding it until some action happens? Are you sure itâs an animated GIF (silly question but have to ask)?
So, inspired by your answer â I tried the following, and it worked:
First, I dropped the animated GIF on the page. In order for it to do what I wanted it to do, as deliberately as I wanted to do it. I right-hand mouse clicked and turned it into a dynamic panel; then placed it properly within the layer and set the condition âOnPageLoadâ to be shown. That way, it tells the otherwise (unbeknownst to it) un-animated to behave in its normal animated state.
What is also interesting, is that Iâve been able to create-and-set conditions to make the GIF play once, and stop despite the fact that itâs a looping file.
Thank you for the inspiration, thank you for the help, and my situation appears solved!
Iâve got the same problem but unfortunatly I can not solve it. I put the animated GIF on my site but when I want to see it in the Preview mode the animation doesnât start. I tried to follow the instructions like in the answer of TheCypherpunk:
place the gif via drag and drop
right-hand mouse click and turned it into an dynamic panel
I clicked on the Image and set it on OnPageLoad > Show (Image)
but still it doesnât work
It would be great if someone could help me with the problem.
When importing the GIF into your RP file, would you happen to be optimizing it at all? If so, could you try importing the GIF without optimizing it (clicking âNoâ if the option pops up) to see if that helps?
If that still doesnât allow the GIF to play as expected, would you be able to attach both the GIF file and the RP file youâre currently working with? Having those files should allow us to get a closer look at what might be going on. Thanks!
Hi, dionneljy. One way to control the start time of an animated GIF is to use the âset imageâ action. When you set a placeholder image in the file to an animation, it will play through from the beginning. The attached file has some variations on this. The animation in each case comes from a non-looping GIF.
Sup RP fam. Remember not to add any behavior to the âConfigured Actionsâ panel when placing your image. Example: do not tick off âanimateâ or âbring to frontâ as Axure will then add their own markup to your Gif. Just place it inâI find this works in Google Chrome.
IE & Gifs in Axure
IE does not animate my gifs. Unfortunately this does not pan well when Stakeholders are using IE so still shopping for a cross-browser solve without affecting performance too bad.