How to play a GIF on click (like 9GaG.com) with wordpress?

Question

I need to implement this \"gif player\" in a wordpress site, because gif pages are up to 6mb, so performance is really crappy

I´ve read this Onclick play GIF image with

Answer 1

What 9GAG essentially did was it had two images - one was the animated GIF, and the other was a still JPG.

Before you clicked on it, it showed the JPG file. After you clicked on it, it loaded the GIF into the same tag, and made you think it "played" the GIF image.

If you click on it again, it loads the JPG file back into the tag, and made you think it "paused" the GIF image.

Image manipulation, like only using one GIF and pausing and playing it is far, far too difficult to be of practical use - this method is one of the better ways to do it.

Here's some code:

Also, if you wish for speed, I think 9GAG does it by preloading the GIF beforehand, like this:

Hope this helps.