4 ms·

img[src$="gif"]{ display:none; } edit: at least it prevents them from being displayed :P

• jefftk 8y ago
  That will match images whose name ends in "gif", but won't match "/foo.GIF" or simply a "/foo" that is a GIF. You can't tell what content type the server thinks the image is until you get the content-type header, and you can't tell what it actually is until it's been downloaded.
  • dredmorbius 8y ago
    It's a good 99% solution.
    • Anon1096 8y ago
      Most gifs being served on the web aren't .gif files anymore, but .webm or .mp4 files instead. That css wouldn't even stop half of the gifs most users see on a daily basis.
      • dredmorbius 8y ago
        I can assure you that: 1. The solution as posed works remarkably well. I know this because I use it myself.[1] 2. Extending the pattern to either be case-insensitive or include other animated image formats is pathetically trivial. ________________________________ Notes: 1. Specifically, in my "Annoyances" stylesheet, applied to all sites by default: /* gifs: So, it has come to this ... (xkcd) */ img[src$=".gif"] { opacity: 0 !important; transition-delay: 3s; transition-duration: 1s; transition-timing-function: ease; transition-property: opacity; display: block; } img[src$=".gif"]:hover { transition-delay: 0.3s; transition-duration: 0.3s; opacity: 1 !important; }