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

Question

У меня есть элемент div с фоновым изображением очень большого размера. Итак, возможно ли установить изображение небольшого размера в качестве фона, пока не загрузится изображение большого размера.

спасибо

Answer 1

Полагаю, вы могли бы поместить под него еще один элемент div (используя свойство z-index) и дать ему более быструю загрузку фонового изображения.

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

Существует также старое свойство lowsrc HTML 4, которое все еще выглядит довольно хорошо поддерживаемым (я не пробовал сам с Netscape 4), но это не будет работать для фоновых изображений .

Answer 2

CSS:

.that-div {
    background-image:url(/path/to/small-image.png);
}

JQuery:

$(function () {
    var bigImg = new Image(),
        bigImgSrc = '/path/to/big-image.png';

    bigImg.src = bigImgSrc;

    $(bigImg).load(function(){
        $('.that-div').css('background-image':'url('+bigImgSrc+')');
    });
});