Animierte GIFs auf Google+ mit CSS blocken

All diese zappeligen, hüpfenden & „lustigen“ animierten GIF Bilder auf Google+ nerven mich ganz ungemein. Darum bin ich auf der Suche nach ’ner Möglichkeit, die zu blocken. So geht’s!

Um das zu erreichen, gibt’s (wie immer… *G*) mehr als einen Weg. Ich zeige mal 3 auf:

  • als Bookmarklet (also somit in JavaScript)
  • in CSS, für Stylish (Firefox/Chrome) bzw. als User Stylesheet
  • Greasemonkey Script

Javascript Bookmarklet

Für ’ne gut lesbare Version, siehe Pastebin🙂

Man erstelle ein neues Bookmark. Als „Adresse“ eintragen:

javascript:function isg(i){return /^(?!data:).*\.gif/i.test(i.src);}function isd(i){return/data:.*/i.test(i.src);}function frz(i){var c=document.createElement(‚canvas‘);var w=c.width=i.width;varh=c.height=i.height;c.getContext(‚2d‘).drawImage(i,0,0,w,h);try{i.alt=i.src;i.src=c.toDataURL(„image/gif“)}catch(e){for(varj=0,a;a=i.attributes[j];j++)c.setAttribute(a.name,a.value);i.parentNode.replaceChild(c,i);}}functionunz(i){var c=document.createElement(‚img‘);var w=c.width=i.width;var h=c.height=i.height;for(varj=0,a;a=i.attributes[j];j++)c.setAttribute(a.name,a.value);i.parentNode.replaceChild(c,i);}functionunx(i){i.src=i.alt}n=document.getElementById(‚gifstop‘);if(n){n.parentNode.removeChild(n);[].slice.apply(document.getElementsByTagName(‚canvas‘)).map(unz);[].slice.apply(document.getElementsByTagName(‚img‘)).filter(isd).map(unx)}else{n=document.createElement(‚a‘);n.id=’gifstop‘;document.body.appendChild(n);[].slice.apply(document.images).filter(isg).map(frz)}

Wenn man auf das Bookmark klickt, hört das Gezappel auf – toll!🙂 Klappt so auf allen Seiten, nicht nur auf Google+.

CSS (Stylish, bzw. User Stylesheet)

Andere Lösung: als CSS (in lesbar auf Pastebin)

  1. /* Apply on googleusercontent.com and plus.google.com */
  2. /* For use (also) with Stylish */
  3. @-moz-document domain(„googleusercontent.com“), domain(„plus.google.com“) {
  4.   img[src*=“gif“] {
  5.    display: none !important;
  6.   }
  7. }
 Entweder man speichert „das da oben“ (bzw. den Pastebin Download) als, bzw. in ~/.config/google-chrome/Default/User StyleSheets/Custom.css. Wenn man dann Chrome mit der Option –enable-user-stylesheet bzw. einem ähnlich benannten Flag startet, hat man Ruhe. Oder aber, man installiert die Stylish Extension und fügt das da oben als Stil hinzu, der auf „URLs auf der Domäne“ googleusercontent.com und auch auf plus.google.com angewandt werden soll.

JavaScript Greasemonkey

Auf http://userscripts.org/scripts/review/80588 gibt es ein Script „Stop gif animations on escape“ für Greasemonkey. Kann man direkt in Chrome installieren, bzw. zuerst Greasemonkey für Firefox installieren und dann das Script. Habe ich noch nicht getestet.

sdafasdf

Schreibe einen Kommentar

Trage deine Daten unten ein oder klicke ein Icon um dich einzuloggen:

WordPress.com-Logo

Du kommentierst mit Deinem WordPress.com-Konto. Abmelden / Ändern )

Twitter-Bild

Du kommentierst mit Deinem Twitter-Konto. Abmelden / Ändern )

Facebook-Foto

Du kommentierst mit Deinem Facebook-Konto. Abmelden / Ändern )

Google+ Foto

Du kommentierst mit Deinem Google+-Konto. Abmelden / Ändern )

Verbinde mit %s