Zap all annoyances: images, colours, plugins, iframes etc

Many web sites' developers seem to think "the more the better" and clutter their pages with endless images, flashy colours, countless videos and flash animations. This is hugely distracting. For years I have been using a couple of buttons to zap these annoyances from this helpful page. And just now I realised I can combine a few of my favourite ones into one button. It removes images, hides iframes and plugins and makes the colour scheme black and white. Here is the relevant JavaScript:

  1. javascript:(function() { function toArray(c) { var a, k; a = new Array; for (k = 0; k < c.length; ++k) a[k] = c[k]; return a; } function R(w) { try { var d = w.document, j, i, t, T, N, b, r = 1, C; for (j = 0; t = ["object", "embed", "applet", "iframe"][j]; ++j) { T = d.getElementsByTagName(t); for (i = T.length - 1; (i + 1) && (N = T[i]); --i) if (j != 3 || !R((C = N.contentWindow) ? C : N.contentDocument.defaultView)) { b = d.createElement("div"); b.style.width = N.width; b.style.height = N.height; b.innerHTML = "<del>" + (j == 3 ? "third-party " + t : t) + "</del>"; N.parentNode.replaceChild(b, N); } } } catch (E) { r = 0; } return r; } R(self); var i, x; for (i = 0; x = frames[i]; ++i) R(x); var newSS, styles = '* { background: white ! important; color: black !important } :link, :link * { color: #0000EE !important } :visited, :visited * { color: #551A8B !important }'; if (document.createStyleSheet) { document.createStyleSheet("javascript:'" + styles + "'"); } else { newSS = document.createElement('link'); newSS.rel = 'stylesheet'; newSS.href = 'data:text/css,' + escape(styles); document.getElementsByTagName("head")[0].appendChild(newSS); } var images, img, altText; images = toArray(document.images); for (var i = 0; i < images.length; ++i) { img = images[i]; altText = document.createTextNode(img.alt); img.parentNode.replaceChild(altText, img); } })();

In order to use it, just create a new bookmark, preferably on the bookmark toolbar, then replace the address with the JavaScript above. Name the bookmark something appropriate, such as "ZAP ALL".

More verbose version:

  1. function() {
  2.     function toArray(c) {
  3.         var a, k;
  4.         a = new Array;
  5.         for (k = 0; k < c.length; ++k) a[k] = c[k];
  6.         return a;
  7.     }
  8.     function R(w) {
  9.         try {
  10.             var d = w.document,
  11.                 j, i, t, T, N, b, r = 1,
  12.                 C;
  13.             for (j = 0; t = ["object", "embed", "applet", "iframe"][j]; ++j) {
  14.                 T = d.getElementsByTagName(t);
  15.                 for (i = T.length - 1;
  16.                     (i + 1) && (N = T[i]); --i)
  17.                     if (j != 3 || !R((C = N.contentWindow) ? C : N.contentDocument.defaultView)) {
  18.                         b = d.createElement("div");
  19.                         b.style.width = N.width;
  20.                         b.style.height = N.height;
  21.                         b.innerHTML = "<del>" + (j == 3 ? "third-party " + t : t) + "</del>";
  22.                         N.parentNode.replaceChild(b, N);
  23.                     }
  24.             }
  25.         } catch (E) {
  26.             r = 0;
  27.         }
  28.         return r;
  29.     }
  30.     R(self);
  31.     var i, x;
  32.     for (i = 0; x = frames[i]; ++i) R(x);
  33.     var newSS, styles = '* { background: white ! important; color: black !important } :link, :link * { color: #0000EE !important } :visited, :visited * { color: #551A8B !important }';
  34.     if (document.createStyleSheet) {
  35.         document.createStyleSheet("javascript:'" + styles + "'");
  36.     } else {
  37.         newSS = document.createElement('link');
  38.         newSS.rel = 'stylesheet';
  39.         newSS.href = 'data:text/css,' + escape(styles);
  40.         document.getElementsByTagName("head")[0].appendChild(newSS);
  41.     }
  42.     var images, img, altText;
  43.     images = toArray(document.images);
  44.     for (var i = 0; i < images.length; ++i) {
  45.         img = images[i];
  46.         altText = document.createTextNode(img.alt);
  47.         img.parentNode.replaceChild(altText, img);
  48.     }
  49. }

Add new comment