A JS Library to Add Play Controls To An Animated GIF – Gifffer

Gifffer is a small Javascript library which disables the autoplaying of an animated GIF and adds play controls over it that allow to play, pause, resume the GIF according to your needs.

Basic Usage:

Include the necessary gifffer.js at the end of the document.

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

Insert an IMG tag in your document and use data-gifffer attribute to specify the source your GIF instead of src.

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

Initialization.

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

All the options can be passed via data-OPTION attributes in the IMG tag.

<img 
     data-gifffer="image.gif" 
     data-gifffer-width="250" 
     data-gifffer-height="250"
>

Changelog:

v1.5.3 (10/11/2018)

• Update

v1.5.1 (06/14/2018)

• Fixing a wrong calculation