Como transformar páginas da web no navegador em preto e branco (escala de cinza)?

Question

Como posso transformar todas as cores de páginas da Web em preto e branco simples no meu navegador?

Quais navegadores suportam isso (Chrome, Internet Explorer ou Firefox)?

Isso é possível?

    

Answer 1

Avance um par de anos, e isso pode ser feito muito bem em CSS.

body {
  /* IE */
  filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);

  /* Chrome, Safari */
  -webkit-filter: grayscale(1);

  /* Firefox */
  filter: grayscale(1);
}

Se você precisa de um atalho reutilizável que funcione em qualquer site, o mais fácil é provavelmente um http://code.tutsplus.com/tutorials/create-bookmarklets-the-right-way--net -18154 "> bookmarklet , que pode ser usado para um bookmarklet como se fosse um URL. O código:

(function () {
  var body = document.body;
  body.style['filter'] = 'progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)';
  if (!body.style['filter']) {
    body.style['-webkit-filter'] = 'grayscale(1)';
    body.style['filter'] = 'grayscale(1)';
  }
}());

E o snippet do bookmarklet:

javascript:(function(){var e=document.body;e.style.filter="progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)",e.style.filter||(e.style["-webkit-filter"]="grayscale(1)",e.style.filter="grayscale(1)")}())

    

Answer 2

Eu encontrei esta entrada de blog que explica como fazer isso no IE e em outros navegadores:

"" Grayscaling "em navegadores não IE " (James Padolsey)

Os princípios básicos do IE especificamente:

elem {
  filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
  /* Element must "hasLayout"! */
  zoom: 1;
}

Você desejará criar um arquivo CSS personalizado e usá-lo no navegador para aplicá-lo a todas as páginas (veja as opções de acessibilidade do IE).

Para outros navegadores, é necessário mais trabalho, incluindo a adição de javascript para percorrer os elementos e converter em escala de cinza. Então não vai ser "point'n'click B & W", mas pode levá-lo na direção certa.

O blog tem uma página de demonstração , e você pode baixar o script JS de lá.

    

Answer 3

Eu estava procurando o mesmo e encontrei várias opções:

• Ferramenta de escala de cinza faz o que você quer

  A desvantagem é que você precisa ativá-lo em todas as páginas, e o atalho é Shift + g , que não funciona se você estiver em um campo de texto . E toda vez que você clicar em algo, você terá cores novamente.

• Efeito de filtro de página faz isso e muito mais, e possui um botão que você pode clicar. Precisa ser ativado por página.

• Sheen oferece um controle deslizante que permite alternar continuamente entre a cor e a escala de cinza. Precisa ser ativado por página.