Animated GIF Player Plugin With jQuery - freezeframe.js

Animated GIF Player Plugin With jQuery - freezeframe.js

freezeframe.js is a fancy touch-enabled jQuery GIF player which allows to manually play an animated GIF frame by frame with custom trigger events/elements. Supports responsive images and mobile touch events. Heavily based on Html5 Canvas technique.

Basic Usage:

1. First you need to load the latest version of jQuery JavaScript library in the html document.

<script src="//"></script>

2. Then load the jQuery freezeframe.js plugin's JavaScript and CSS in the document. Note that the freezeframe.min.js must be loaded after jQuery library.

<link rel="stylesheet" href="freezeframe_styles.min.css">
<script src="freezeframe.min.js"></script>

3. Just call the function on the GIF's parent container and done. By default, the plugin will pause the GIF and play it on mouse hover.


4. Default plugin options.

  // The selector freezeframe will use to search for .gifs when the capture() function is run (if no custom selector is passed to the capture() function).
  selector : '.freezeframe',
  // The number of milliseconds a .gif will animate for when triggered by click / touch event.
  animation_play_duration: 5000,
  // 'hover' or 'click'
  non_touch_device_trigger_event: 'hover'


  • v3.0.9:¬†fixed overlay class toggle issue


  • v3.0.8

This awesome jQuery plugin is developed by ctrl-freaks. For more Advanced Usages, please check the demo page or visit the official website.

  • Publication date: 22.05.2018
  • Source