Событие привязки JQuery, когда фоновое изображение CSS полностью загружено

Я хотел бы вызвать событие после того, как фоновое изображение ПОЛНОСТЬЮ загружено. Изображение сделано из динамического скрипта PHP.

$("#box").css("background-image","url(image.php)");

может быть, я могу попытаться получить изображение в невидимом <img> и при загрузке изображения (.load()) установить фоновое изображение с src этого невидимого <img>? не уверена...

спасибо за помощь.


person pelelive    schedule 28.10.2011    source источник


Ответы (2)


Вы можете использовать мой плагин jQuery под названием waitForImages, который поможет с этим...

$("#box").css("background-image", "url(image.php)").waitForImages({
   waitForAll: true,
   finished: function() {
       // Background image has loaded.
   }
});

В противном случае, чтобы сделать это вручную...

var image = 'image.php',

    img = $('<img />');

img.bind('load', function() {
     // Background image has loaded.
});

img.attr('src', image);

$('#box').css('background-image', 'url(' + image + ')');
person alex    schedule 28.10.2011
comment
Вы знаете, почему я получаю эту ошибку: Ошибка: $.isPlainObject не является функцией? (обратите внимание, что image.php генерирует новое изображение каждый раз, когда мы его вызываем) - person pelelive; 28.10.2011
comment
@pelelive Вы используете ‹ jQuery 1.4? - person alex; 30.10.2011
comment
спасибо, Алекс, теперь это работает. ваше здоровье! - person pelelive; 30.10.2011

person    schedule
comment
Это элемент background-image, а не элемент img. - person alex; 28.10.2011