All geek questions in one place

Can I pause a .gif image?

Is it possible to start .gif animation when you hover over it and pause it when you do not hover over it? I do not want to reset the image to the beginning of its animation, stopping above it.

EDIT: Thanks for the help, but nothing worked out as I wanted. The best solution I found for this was as follows:

HTML:

<img id="gif1" src="static1.jpg">

JS:

 $("#gif1").hover( function() { $(this).attr("src", "animate1.gif"); }, function() { $(this).attr("src", "static1.jpg"); } );

So just a reboot.

+6
source share
1 answer

One possible solution would be two images: one still image and one animated gif. Then change src when it hangs (as described here: fooobar.com/questions/163495 / ... ).

There is also a plugin that you can use for this purpose: https://github.com/chrisantonellis/freezeframe

I assume that this plugin applies the logic described above, only more beautiful.

However, if you really want to pause the animation, you may need a set of images that create the animation, and move through the images in the specified order when you hover the mouse and pause when you mouse out and record the last image paused. This has been implemented here: fooobar.com/questions/985222 / ... Click for DEMO

+5
source

Source: https://habr.com/ru/post/985221/

More articles:


All Articles