Want to control animated GIF pictures? Try Gifffer.js.

Online Demo: http://www.gbtags.com/gb/demoviewer/3578/c6bec39a-61ae-4017-8e23-e0bc1eeb740f/example|index.html.htm

Everyone may have been used to the ubiquitous GIF images on the Internet, but have you ever thought about letting users try to control the playback of animated GIFs? In today's article, we will introduce a great JavaScript small class library-gifffer.js, which can help you to add control GIF animation function, want to try?

How do I use it?

First quote JS, as follows:

1. <scriptType="Text/javascript"src="Gifffer.min.js"></script>

Use the following code in HTML to refer to a GIF picture:

1. Data-gifffer="Gbtags.gif"/>

Note Replace the SRC attribute with Data-gifffer to implement control

The final step is to add the processed JavaScript as follows:

1. Window. OnLoad =function(){
2. Gifffer();
3. }

Done, isn't it very simple.

Implementation principle

In fact, when you look at the code, you will find that the way to do this is to replace the image with a div and add a run button, and use the HTML canvas to create a background screen

Compatibility: Chrome, FF, Safari, Opera, ie9+
Read the original: Would you like to control the animation of GIF pictures? Try Gifffer.js.