0

div が読み込まれ、AJAX 呼び出しから画像が入力された後、div の幅と高さを取得するコードを実行しようとしています。

画像が配置されるまでdivは0x0であるため、ほとんどすべてが壊れる前に寸法を確認してください。

.load() を試しました (これは AJAX 呼び出しであるため機能しません)。imagesLoaded js プラグインも試しました。これが私が今持っているものです：

alert('outside;')
function startBubbles(){
    alert('inside');
    var space = new DisplaySpace($('#bubbleWrap').height(), $('#bubbleWrap').width());
    var count = 1;
    alert(space.getHeight());
    var delay = (function(){
      var timer = 0;
      return function(afterResize, ms){
        clearTimeout (timer);
        timer = setTimeout(afterResize, ms);
      };
    })();

    var spawnInterval = self.setInterval(function(){
        var aBubble = new Bubble(count, space);
        count++
        aBubble.spawnimate(aBubble);
        setTimeout(function() {aBubble.popBubble(aBubble)},Math.floor((Math.random()*30000)+10000));
    }, 500);
});

画像が表示される前にすべてのアラートが発生し、「スペース」オブジェクトの高さと幅が 0 のままです。

bubbleWrap は、問題の画像を含む読み込みゾーン内の div です。ほとんどの場合、ここで手動で遅延して問題を解決することしかできないと思いますが、それは最適ではないようです。私は何が欠けていますか？

私は今、この特定の状態の負荷を次のように実装しています:

History.Adapter.bind(window,'popstate',function(){ 
                var state = History.getState(); 
                state = 'target='+state.data.state;
                $.get('contents.php', state, function(data){
                    if(state == 'target=bubbles'){
                        $('#loading_zone').html(data).waitForImages(startBubbles());
                    }
                    else{
                        $('#loading_zone').html(data);
                    }

                });
        });

残念ながら、ページをリロードすると、高さは 10 しかありません。何かご意見は？

4

1 に答える 1

0

これをうまく行うことができるプラグインがあります。

新しい HTML を挿入した後に呼び出すだけです。

// Assume this function is the callback to the *success*.
function(html) {
    $("#target").html(html).waitForImages(function() {
        // All descendent images have now loaded, and the 
        // containing div will have the correct dimensions.
    });
};
于 2012-10-22T00:57:16.507 に答える