Question

这不是关于图像重叠而是出现故障的问题。

我有一个应用程序，当你搜索给定的游戏时，返回一个类似的游戏列表。问题是，当你搜索一个没有被追逐的游戏时，它会以奇怪的顺序将它们吐出来，如果你之后立即再次进行搜索，它会以正确的顺序将它们吐出来。

我有这段代码（应该是相关的）：

$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>'
    );
}

如果你在items上执行console.log（），那么你会看到它们是有序的，但同样，它们出错了。

网站位于：http://newgameplus.nikuai.net/

你可以看到它在做什么。对不起，我没有制作一个jsfiddle，它从数据库中提取游戏。

如果有什么不清楚的地方，我会尽力做到这一点。谢谢。

Answer 1

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

砖石图像奇怪地出来。

1 个答案: