JQuery bind событие, когда CSS background-image полностью загружен [дубликат]

этот вопрос уже есть ответ здесь:

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

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

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

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

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 + ')');

$("#box img").load(function() {  
    //the image elements in #box are fully loaded.
});