Предварительно загруженные изображения не отображаются в Chrome

Question

Я предварительно загружаю некоторые изображения и затем использую их в лайтбоксе. У меня проблема в том, что, хотя изображения загружаются, они не отображаются браузером.

Эта проблема относится только к Chrome. Он сохранился в Chrome 8 - 10, и я все это время пытался исправить это, но ничего не нашел.

Я читал эти похожие вопросы,
Chrome не отображает изображения, хотя ресурсы передаются в браузер
2 Незначительные проблемы с CSS. Фоновые изображения не отображаются в Google Chrome?
Загруженные изображения JavaScript загружаются

Который детализирует подобное поведение, кроме Chrome для Mac. В то время как это происходит в Windows.

• Все остальные браузеры вроде бы в порядке.
• Если у вас открыты Firefox и Chrome, загрузите страницу в Firefox, а затем в Chrome отобразятся изображения.
• После того, как вы вручную загрузили изображения с помощью панели инструментов Webkit webdev, они всегда отображаются
• Все ссылки на изображения и прочее в порядке и работают
• Очистка всего из Chrome, похоже, не имеет значения (кеш, история и т. Д.)

Если у кого-то есть какие-либо идеи, это было бы фантастически полезно, поскольку у меня здесь буквально все нет вариантов.

PS, извиняюсь, если есть поздние ответы, завтра я уезжаю в отпуск на неделю! : D

Обновление Вот функция javascript, которая предварительно загружает изображения.

var preloaded = new Array();
function preload_images() {
    for (var i = 0; i < arguments.length; i++){
        document.write('<');
        document.write('img src=\"'+arguments[i]+'\" style=\"display:none;\">');
    };
};

Обновление
У меня все еще есть проблемы с этим, и я удалил всю функцию предварительной загрузки изображений. Возможно, доставка таблицы стилей через document.write() не лучший способ?

Answer 1

Chrome может не загружать их заранее, поскольку он пишет в DOM без дисплея, поэтому он может быть достаточно интеллектуальным, чтобы понять, что его не нужно отображать.Попробуйте вместо этого:

var preloaded = new Array();

function preload_images(){
    for (var x = 0; x < preload_images.arguments.length; x++)
    {
        preloaded[x]     = new Image();
        preloaded[x].src = preload_images.arguments[x];
    }
}

Объект Javascript Image также имеет много полезных функций, которые могут оказаться полезными:

http://www.javascriptkit.com/jsref/image.shtml

onabort ()

Код выполняется, когда пользователь прерывает загрузку изображения.

onerror ()

Код выполняется, когдапроисходит ошибка при загрузке изображения (то есть: не найдено).Пример (ы)

onload ()

Код выполняется, когда образ успешно и полностью загружается.

И тогда у вас также естьcomplete свойство, которое true / false сообщает вам, если изображение полностью (предварительно) загружено.

Answer 2

Оказывается, что Chrome учитывает HTTP-кэширование и удаляет все предварительно загруженные изображения сразу после предварительной загрузки, если для Caching неправильно установлено значение expire.

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

Чтобы исправить это, я должен был установить следующее:

        Response.Cache.SetExpires(DateTime.Now.AddYears(1));
        Response.Cache.SetCacheability(HttpCacheability.Public);

        return File(jpegStream, "image/jpeg");