我试图将砌体元素附加到现有元素上。
然而,我现在拥有的是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'>
添加到商品标记。
但是,现在刷新页面时没有显示任何元素。
答案 0 :(得分:0)
让他们加载引导隐藏类集,并在砌体运行后将其删除。
如果砌体需要它们可见才能进行计算,请在加载时将它们显示在屏幕外。 Z-index,疯狂的位置等
<强>更新强> http://masonry.desandro.com/methods.html
所以我快速浏览了一下这里的方法,没有我谈到的这个技巧,我相信你可以ajax加载你的新项目,然后使用masonry.addItems(items)方法。