Заменить недоступные изображения через CSS?

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

Я пытался обернуть все изображения Фоновые Div в:

<div class="no_broken"> 
    <img src="http://www.web.com/found.gif"/> 
</div> 

<div class="no_broken"> 
    <img src="http://www.web.com/notfound.gif"/> 
</div>

CSS:

div.no_broken { 
    background-image: url(standard.gif); 
} 

div.no_broken, div.no_broken img { 
    width: 32px; 
    height: 32px; 
    display: block; 
}

Но это будет отображать два изображения друг на друга, если IMG прозрачен.

источник

2008-11-04 aemkei

Это работает без CSS:

<img src="some.jpg" onerror="this.src='alternative.jpg';">

кажется, даже работать, когда Javascript отключен.

источник

2008-11-04 12:02:15 schnaader

Это странно. выглядит как javascript для меня:/О, хорошо. это не первая и последняя нечетная функция, найденная в браузерах. – Gene 2008-11-04 13:29:18

Это не работает, когда JavaScript отключен. И это вызовет бесконечный цикл, если альтернативу случайно отсутствует. – asiby 2013-04-14 21:49:31

Насколько я знаю, не существует свойства CSS, которое управляет отображением сломанных изображений. Может быть, есть специфические для браузера свойства? Возможно, вам придется прибегнуть к Javascript для повторения изображений на странице и замены их src, если они сломаны.

источник

2008-11-04 11:56:25

Я не использую технологию, которую вы используете, но в ASP.net есть что-то, что называется адаптерами управления.

Я использовал это, чтобы захватить PreRender всех изображений и заменить imageurl, если imageurl не завершен.

Я не знаю, относится ли это вообще к вашей ситуации и, конечно же, не будет работать, если на пути есть путь, но не изображение.

источник

2008-11-04 11:59:01 YonahW

Этот код является JavaScript и будет работать только при включенном JS. Как это ни странно, это также работает, если в IE, если файл доступен с локальной машины (с файлом: ///). Когда страница будет доступна с http, она не будет работать без JS.

источник

2008-11-05 14:14:13

Если вы хотите добавить javascript в микс, это должно хорошо работать с jQuery, чтобы обнаруживать ошибки изображения и добавлять к сломанным изображениям некоторый класс CSS состояния ошибки.

$(document).ready(function() { 
    $('.no_broken img').error(function() { 
     $(this).addClass('broken'); 
    }); 
});

И тогда в вашем CSS, вы могли бы что-то вроде

div.no_broken, div.no_broken img { 
    width: 32px; 
    height: 32px; 
    display: block; 
} 

div.no_broken img.broken { 
    background-image: url(standard.gif); 
    content:""; 
}

источник

2014-04-08 19:06:09 broox

Мысль я пакет комментарий от kmoser в ответ. Очистка обработчика onerror - хорошая идея, поскольку возможны петли.

Javascript

function epic(c) { 
    c.onerror=''; 
    c.src='alternative.jpg'; 
};

HTML

<img src='some.jpg' onerror='epic(this)'>

Мы бросаем эту эпическую функцию во все наши теги изображений теперь twiends, как мы тянуть в грузах изображений социальных профилей, которые все истекают в какой-то момент будущее.

источник

2015-06-24 13:15:56

Заменить недоступные изображения через CSS?

ответ

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