停止在砌体初始化之前显示的项目

时间:2014-04-03 21:11:46

标签: javascript jquery jquery-masonry

我试图将砌体元素附加到现有元素上。

然而,我现在拥有的是this - 在砌体初始化之前显示的项目然后在一秒钟后跳到位置。我希望他们能够被隐藏起来,直到他们处于适当的位置。

这是我用来附加砌体物品的代码(在无限滚动插件中):

$container.append(data);
$container.imagesLoaded( function()
{
    $container.masonry('reloadItems').masonry();
});

这里正在初始化:

$(document).ready(function ()
{
    $container = $('#container');
    // initialize the masonry instance
    $container.imagesLoaded(function(){
        $container.masonry({
            columnWidth: 1,
            itemSelector: '.item',
            transitionDuration: 0
        });
    });

    $('#container').scrollPagination({

        nop     : 36, // The number of posts per scroll to be loaded
        offset  : 0, // Initial offset, begins at 0 in this case
        error   : 'No More Posts!', // When the user reaches the end this is the message that is
                                    // displayed. You can change this if you want.
        delay   : 500, // When you scroll down the posts will load after a delayed amount of time.
                       // This is mainly for usability concerns. You can alter this as you see fit
        scroll  : true // The main bit, if set to false posts will not load as the user scrolls. 
                       // but will still load if the user clicks.   
    });
});

更新

根据Josh的回答,我的代码现在看起来像这样:

$container.append(data);
$container.imagesLoaded( function()
{
    $(".item").show();
    $container.masonry('reloadItems').masonry();
});

我已将<class='hide'>添加到商品标记。

但是,现在刷新页面时没有显示任何元素。

1 个答案:

答案 0 :(得分:0)

让他们加载引导隐藏类集,并在砌体运行后将其删除。

如果砌体需要它们可见才能进行计算,请在加载时将它们显示在屏幕外。 Z-index,疯狂的位置等

<强>更新 http://masonry.desandro.com/methods.html

所以我快速浏览了一下这里的方法,没有我谈到的这个技巧,我相信你可以ajax加载你的新项目,然后使用masonry.addItems(items)方法。