CSSの背景イメージが完全にロードされたときのJQueryバインドイベント

私は背景イメージが完全にロードされた後でイベントをトリガーしたいと思います。 イメージは動的PHPスクリプトから作成されます。

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

おそらく私は目に見えない で画像を取得しようとする可能性があり、画像のロード(.load()) その目に見えない のsrcで背景画像を設定しますか?わからない...

ご協力ありがとうございました。

7

2 答え

あなたはこれを助ける waitForImages と呼ばれる私のjQueryプラグインを使うことができます...

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

そうでなければ、手動で行う...

var image = 'image.php',

    img = $('');

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

img.attr('src', image);

$('#box').css('background-image', 'url(' + image + ')');
10
追加された
@pelelive
追加された 著者 alex,
なぜこのエラーが出るのか知っていますか?エラー:$ .isPlainObjectは関数ではありませんか? (image.phpは、呼び出すたびに新しいイメージを生成することに注意してください)
追加された 著者 pelelive,
アレックスが今働いてくれてありがとう。乾杯!
追加された 著者 pelelive,
$("#box img").load(function() {  
    //the image elements in #box are fully loaded.
});
1
追加された
これは img 要素ではなく、背景画像です。
追加された 著者 alex,