GIF Image Previewer And Player Plugin For jQuery - GIF-loader

File Size: 5.63 MB
Views Total: 1256
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
GIF Image Previewer And Player Plugin For jQuery - GIF-loader

GIF-loader is a jQuery GIF player plugin that uses a static image (typically the first frame of your GIF) as the preview image and allows the user to load / play / pause the animated GIF manually. Useful for your webpages containing many heavy GIF images to reduce the page load time.

How to use it:

1. The GIF-loader plugin requires Font Awesome 4 for play / pause icons.

<link rel="stylesheet" href="font-awesome.min.css">

2. Include jQuery library and the jQuery GIF-loader's files on the webpage.

<link rel="stylesheet" href="css/jquery.gif.css">
<script src="jquery.min.js"></script>
<script src="jquery.gif.min.js"></script>

3. Insert your GIF images into the webpage as follows.

  • src: path to the static image
  • data-gif: path to the GIF image
<img src="preview.jpg" data-gif="img.gif" class="gif">

4. Initialize the plugin and done.


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