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

我建议在 jquery append 函数中添加一个 masonry("reload") 函数。我认为它没有伤害，但我想知道为什么你的 columnWidth 是 1？如果我记得它应该是周围容器的倍数而不是 1？

于 2012-07-25T18:53:59.313 回答