sparkbox / bouncy-ball

:red_circle: Compare web animation techniques by bouncing a ball with each one.
https://sparkbox.github.io/bouncy-ball
MIT License
605 stars 66 forks source link

Add an animated gif example #38

Closed bryanbraun closed 7 years ago

bryanbraun commented 7 years ago

In #35, @tigt recommended using other animated image formats as fallbacks:

GIF, animated WebP, Animated PNG — probably all 3 at once using <picture>:

  <picture>
    <source srcset="ball.webp" type="image/apng">
    <source srcset="ball.apng" type="image/webp">
    <img src="ball.gif" alt="Bouncy ball">
  </picture>

That would make this an more generic "animated images" approach.

I've got some preliminary work in place for this so I'll assign it to myself.