Как заставить текст изображения изображения вместо изображения?

Существует веб-сайт, текст которого я заинтересован в чтении, однако изображения, которые его сопровождают могут содержать, которые я бы предпочел не видеть. Я пытаюсь использовать расширение Firefox Стильный, чтобы добавить правило для этого веб-сайта.Как заставить текст изображения изображения вместо изображения?

Следующие правила CSS работают почти как я предпочел бы:

img { 
    display: none !important; 
    /* visibility: hidden !important; */ 
} 

* { 
    background-image: none !important; 
}

(Закомментированный линия является альтернативой, я знаю разницу между этими двумя вариантами)

В то же время , Я бы предпочел сохранить отображаемый alt-текст изображений, поскольку это может помочь мне решить, будет ли конкретное изображение одним из тех, что я хотел бы видеть.

Есть ли способ добавить правило CSS, которое скроет изображение, но отобразит его alt-текст, если последний установлен?

источник

2015-08-20 George T

Использовать [lynx] (http://lynx.browser.org)? – steveax

довольно уверены, что это не то, что вы можете сейчас сделать только с помощью CSS. Вам нужен пользовательский указатель.

Установите Greasemonkey или Tampermonkey или аналогичный. Тогда это userscript будет работать:

// ==UserScript== 
// @name  _Hide pics except for alt text 
// @include http://YOUR_SERVER.COM/YOUR_PATH/* 
// @require http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js 
// @require https://gist.github.com/raw/2625891/waitForKeyElements.js 
// @grant GM_addStyle 
// ==/UserScript== 

GM_addStyle ("         \ 
    * {           \ 
     background-image: none !important;  \ 
    }           \ 
"); 

waitForKeyElements ("img", hideImageExceptForAltText); 

function hideImageExceptForAltText (jNode) { 
    var oldSrc = jNode.attr ("src"); 
    jNode.attr ("src", ""); 
    jNode.attr ("data-oldSrc", oldSrc); 
}

Он использует waitForKeyElements для обработки изображений на AJAX-управляемых сайтах.

источник

2015-08-20 20:10:58

Спасибо за предложение! Я использовал ваш скрипт в качестве базы, чтобы создать тот, который скрывает изображения (вместо простого изменения src) и отображает ссылку, чтобы показать их. Однако до тех пор, пока страница не загрузится, все еще не происходит, и изображения отображаются на мгновение. Есть ли способ заставить его работать во время загрузки страницы, чтобы изображение вообще не отображалось? –

Да, но это новая/отдельная проблема. Отметьте это как принятое и спросите другого Q о дополнительной проблеме. Обязательно включите соответствующий код. –

В этом вопросе упоминается Firefox, и насколько мне известно, имя greasemonkey не используется в других браузерах. В любом случае, это будет упомянуто и в другом вопросе. –

-1

Один из вариантов - это надстройка для браузера: https://chrome.google.com/webstore/detail/image-alt-text-viewer/hinbolcnfifkhlcehoakdledkfjiaeeg?hl=en (Это пример хром).

В противном случае, попробуйте:

content: attr(alt);

Это не полное решение для вас, но, надеюсь, он может установить вас на правильном пути.

источник

2015-08-20 15:44:58 DavidMichaelangelo

вы не можете использовать до/после на img-тегах ... – OZZIE

Откройте инструмент разработчика и в консоли javascript выполните следующую команду jquery, чтобы скрыть все изображения.

$('img').attr('src','');

при нажатии клавиши ввода всех изображений будет иметь Src атрибута от нулевого и альтернативного текста будет отображаться

источник

2015-08-20 16:00:12

Полезная идея, но не практично запускать консольный скрипт при каждом изменении страницы. Кроме того, не каждая страница/сайт использует jQuery. –

используйте его в главной странице, я буду работать для всех подстраниц –

Как заставить текст изображения изображения вместо изображения?

ответ

Смежные вопросы