Перезагрузка фоновых изображений в IE6

Несколько раз сталкивался с одной неприятной проблемой при отображении страниц в Internet Explorer 6. Эффект проявлялся на сложных страницах со всевозможным «хитрым» позиционированием и оформлением блоков. Я заметил, что браузер при обновлении страниц постоянно перегружает фоновые изображения.

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

Решением этой проблемы послужил следующий трюк.


html {
    filter: expression(document.execCommand("BackgroundImageCache", false, true));
}

Для любителей валидировать CSS это правило можно заключить в условный комментарий только для IE.


<!--[if IE]><link rel="stylesheet" type="text/css" media="all" href="/css/ie.css"></link><![endif]-->

Так же можно использовать альтернативный вариант в виде JavaScript.

try {
    document.execCommand("BackgroundImageCache", false, true);
} catch (err) {}