Estou procurando uma configuração ou extensão do Firefox que possa alternar facilmente entre mostrar e ocultar todas as imagens sem recarregar a página (semelhante ao recurso do Opera - o recurso 'Mostrar apenas imagens em cache' é preferível, mas opcional no meu caso).
Encontrei uma extensão que pode mostrar/ocultar imagens (Imagem-Mostrar-Ocultar), mas é necessário recarregar a página para mostrar/ocultar as imagens.
Prefiro que a página não seja recarregada ao exibir imagens de uma página previamente configurada para ocultar todas as imagens.
Responder1
ImagemPrefé uma extensão que permite alternar a exibição de imagens sem recarregar, embora a página inicial mencione que pode não funcionar em certas circunstâncias (sem nome). Percebi que ele funciona lentamente se houver muitas guias abertas.
Se você estiver disposto a aceitar compensações, aqui está outro bookmarklet que faz parte do que você está pedindo:
javascript:(function(){function%20toggleImages(root){var%20stylesheet,stylesheetId='bookmarklet-hide-image-stylesheet',rules='*%20{%20background-image:%20none%20!important;%20}%20img,%20input[type=image],%20object[type^=image]%20{%20visibility:%20hidden%20!important;%20}',tagNames=['frame','iframe'],elements,i,j;stylesheet=root.getElementById(stylesheetId);if(stylesheet){stylesheet.parentNode.removeChild(stylesheet);}else{stylesheet=root.createElement('style');stylesheet.type='text/css';stylesheet.id=stylesheetId;if(stylesheet.styleSheet){stylesheet.styleSheet.cssText=rules;}else{stylesheet.appendChild(root.createTextNode(rules));}root.getElementsByTagName('head')[0].appendChild(stylesheet);}for(i=0;i<tagNames.length;i+=1){for(j=0,elements=root.getElementsByTagName(tagNames[i]);j<elements.length;j+=1){toggleImages(elements[j].contentDocument);}}}toggleImages(document);}());
Ele tenta ocultar e exibir imagens de fundo, <img>
tags e <input>
tags <object>
com type="image"
, mas ainda existem muitos métodos de entrega de imagens mais estranhos que ele não detecta, como <embed>
ou <object>
com <param>
tags. Ele não funcionará em vários domínios devido a medidas de segurança do navegador (normalmente perceptíveis quando há anúncios em <iframes>
) e pode ser substituído por uma folha de estilo do usuário ou derrotado se uma página usar !important
.
Código-fonte legível para os interessados:
(function () {
function toggleImages(root) {
var stylesheet,
stylesheetId = 'bookmarklet-hide-image-stylesheet',
rules = '* { background-image: none !important; } img, input[type=image], object[type^=image] { visibility: hidden !important; }',
tagNames = ['frame', 'iframe'],
elements,
i,
j;
stylesheet = root.getElementById(stylesheetId);
if (stylesheet) {
stylesheet.parentNode.removeChild(stylesheet);
} else {
stylesheet = root.createElement('style');
stylesheet.type = 'text/css';
stylesheet.id = stylesheetId;
if (stylesheet.styleSheet) {
stylesheet.styleSheet.cssText = rules;
} else {
stylesheet.appendChild(root.createTextNode(rules));
}
root.getElementsByTagName('head')[0].appendChild(stylesheet);
}
for (i = 0; i < tagNames.length; i += 1) {
for (j = 0, elements = root.getElementsByTagName(tagNames[i]); j < elements.length; j += 1) {
toggleImages(elements[j].contentDocument);
}
}
}
toggleImages(document);
}());
Responder2
Você não precisa de javascript. O OP queria uma maneira fácil de alternar imagens sem recarregar a página e aqui está:
Use a extensão "Stylish" para Firefox/Chrome/etc e, em seguida, use o código que adicionei abaixo. Funcionará para todos os sites e ocultará todas as imagens, vídeos (incorporados) e imagens de fundo.
@namespace url(http://www.w3.org/1999/xhtml);
/*Hide Images*/
IMG { display: none !important }
/*Hide Videos*/
iframe { display:none !important }
/*Hide Background*/
body {background:none !important }
a {background:none !important }
div {background-image:none !important }
div {background:none !important }
Responder3
Posso lhe dizer como eliminar todas as imagens de uma página com um clique e sem recarregar a página. Basta salvar a seguinte linha de código como um favorito na barra de ferramentas de favoritos do Firefox e nomeá-la como "zap images".
javascript:(function(){function%20toArray%20(c){var%20a,%20k;a=new%20Array;for%20(k=0;%20k%20<%20c.length;%20++k)a[k]=c[k];return%20a;}var%20images,%20img,%20altText;images=toArray(document.images);for%20(var%20i=0;%20i%20<%20images.length;%20++i){img=images[i];altText=document.createTextNode(img.alt);img.parentNode.replaceChild(altText,%20img)}})();
Agora, abra uma página web com imagens e clique neste marcador. Você acabou de zapear as imagens. No entanto, para trazê-los de volta, você precisa atualizar a página.