23

Is there any way, in HTML, to include an animated GIF in an <img> tag, but automatically tell the GIF to not animate? I realize that the user can stop animation by pressing ESC or clicking Stop, but I want the GIFs not to animate at all.

I only want to do this on one specific page, and making separate non-animated versions of the (1500+) GIFs is not feasible. I simply want the GIFs to not animate.

WendiKidd
  • 4,333
  • 4
  • 33
  • 50
dirtside
  • 8,144
  • 10
  • 42
  • 54
  • 1
    possible duplicate of [Stopping Gif Animation Programmatically](http://stackoverflow.com/questions/3688460/stopping-gif-animation-programmatically) – Jeremy Jul 17 '12 at 03:12
  • 1
    Have look at this : [https://stackoverflow.com/questions/2385203/](https://stackoverflow.com/questions/2385203/can-you-control-gif-animation-with-javascript?utm_medium=organic&utm_source=google_rich_qa&utm_campaign=google_rich_qa) This might solve your problem. – NightOwl May 29 '18 at 11:51

5 Answers5

4

You could use Giffer.

Just include the library in your page:

<script type="text/javascript" src="gifffer.min.js"></script>

Instead of setting src attribute on your image use data-gifffer.

<img data-gifffer="image.gif" />

At the end, call Gifffer() whenever you want. For example:

window.onload = function() {
    Gifffer();
}

If you don't want the GIF to move at all you can always edit the .js file to remove the play button.

1

Use ImageMagik, and you can readily convert all 1500 images.

Bryce
  • 8,313
  • 6
  • 55
  • 73
1

Not with plain HTML but using PHP with imagecreatefromgif might help you

victor hugo
  • 35,514
  • 12
  • 68
  • 79
1

I don't think calling window.stop() will be a good solution. This would need to be called for every image that is loaded to prevent it from running half way through and stopping. The best solution is to use a library such as GD to create images featuring just the first frame of the animated GIF.

0

You could use window.stop() in javascript, which should be the equivalent of pressing ESC/clicking stop. However, I'm pretty sure it won't work in all browsers (i.e. IE).

Alconja
  • 14,834
  • 3
  • 60
  • 61