0

これは、画像が重なり合うという問題ではなく、順序が乱れるという問題です。

特定のゲームを検索すると、類似したゲームのリストを返すアプリケーションがあります。問題は、キャッシュされていないゲームを検索すると、それらが奇妙な順序で吐き出されることです。その直後に再度検索を行うと、正しい順序で吐き出されます。

私はこのコードを持っています(関連するはずです):

$container.imagesLoaded( function(){
        $container.animate({ opacity:1});
        $container.masonry({
            itemSelector: '.box',
            columnWidth: 1,
            isAnimated: !Modernizr.csstransitions
        });
    });

for ( var i=0; i < len; i++ ) {
                    item = balls();
                    items.push( item ); 
                }
                var $items = $( items.join('') );
                //Load up the initial boxes. 
                $items.imagesLoaded(function(){
                  $container
                    .append( $items ).masonry( 'appended', $items, true );
                });

function balls(){
    $iterator -= 1;
    if($iterator < 0){
        var $boxes = $( '<div class="box">No more games!</div>' );
        $container.append( $boxes ).masonry( 'appended', $boxes, false );   
        return; 
    }
    return (
        '<div class="box" style="width:18%">'
        +'<p>'+$test[$iterator][1][2]['name']+'</p>'
        +'<img src="scripts/php/timthumb.php?src='+$test[$iterator][2]+'&q=100&w=300"/>' //Replace this with the one below when timthumb is whitelisted
        +'<div id=boxBottom>'+Math.floor($test[$iterator][0]*100)+'%</div>'
        +'</div>'
    );
}

で console.log() を実行するitemsと、それらが正しいことがわかりますが、やはり間違っています。

サイトはこちらhttp://newgameplus.nikuai.net/

あなたはそれが何をしているのかを見ることができます。申し訳ありませんが、私は jsfiddle を作成していません。データベースからゲームを取得しています。

ご不明な点がございましたら、できる限り対応させていただきます。ありがとうございました。

4

1 に答える 1

0

masonry("reload") 関数を jquery の append 関数に追加することをお勧めします。害はないと思いますが、なぜ columnWidth が 1 なのですか? 私が覚えていれば、それは周囲のコンテナの倍数でなければなりませんが、1 ではありませんか?

于 2012-07-25T18:53:59.313 に答える