How can I replay/reload GIF image on the same page? | XM Community
Question

How can I replay/reload GIF image on the same page?

  • 13 November 2020
  • 1 reply
  • 297 views

I now have a GIF graphic inserted. It plays once and stops static. How can I make it replay or reload on click?

The html code looks like this now.





Thank you.


1 reply

Userlevel 7
Badge +27

Hi there, if you still need, I found a codepen that does what you are describing. It uses a "Restart Gif" button that will restart the gif when clicked. There are other implementations that you might check out as well, but I thought the codepen one did the trick.
First, add the gif and the restart button to the Question Text using the Rich Content Editor's HTML/Source View, updating the URL of the gif as needed:


Click to write the question text.
Then, add the below to the OnReady of the question's JavaScript:
jQuery('#targetA').click(function() {
    var $element = jQuery('#gif');
    var src = $element.attr('src');
    $element.attr('src', '#');
    $element.removeClass('hidden');
    $element.css('opacity');

    setTimeout(function() {
        $element.attr('src', src);
    }, 0);
});

Leave a Reply