You cannot control an animated gif with javascript but you can give the impression that you are starting and/or stopping the animation, albeit at the beginning or the end of its sequence, unless you do some serious editing.
| Animation starts onmouseover and stops onmouseout | ![]() |
| Animation starts onclick and stops onclick |
|
| Animation is starts and stops by a script in 2 second intervals |
|
The trick is to make a copy of the first or last frame of the animated gif and used it as the default image, then swap the image for the animated gif.
Mousing over the following example starts sonic running and when you mouseout sonic turns and runs back.
This is achieved by simply flipping each image in the animated gif and creating a second animated gif.