Question

更新：这不会加载任何内容：此代码有什么问题？

<script type="text/javascript" src="http://static.tumblr.com/snscsmd/Z3ln6cev3/jquery.infinitescroll.min.js"></script>

<script type="text/javascript">
$('#content').infinitescroll({
// infinite scroll settings
}, function(newPosts){
$(newPosts)
.wrapAll('<div class="photoset-grid">') //wrap them in place
.parent() //get .photoset-grid
.photosetGrid({
    //photoset grid settings
});
});
</script>

我的问题是将Infinite Scroll与Photoset Grid合并。我需要回调，但我不确定如何实施。

网站：http://sindreolsson.tumblr.com/

HTML

{block:Photoset}
<div class="photoset-grid" data-layout="{PhotosetLayout}" data-id="photoset{PostID}" style="visibility: hidden;" />
{block:Photos}
<img src="{PhotoURL-500}"
{block:HighRes}data-highres="{PhotoURL-HighRes}"{/block:HighRes}
width="{PhotoWidth-500}" height="{PhotoHeight-500}"
{block:Caption}alt="{Caption}"{/block:caption} />
{/block:Photos}
</div><!-- /.tumblr-photoset -->

{block:Caption}<div class="photoset-grid-copy">{Caption}</div>{/block:Caption}
{/block:Photoset}

脚本：

<!--Photoset-grid script -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<script src="http://static.tumblr.com/mviqmwg/XyYn59y3a/jquery.photoset-grid.min.js"></script>

<script type="text/javascript">
$(document).ready(function(){
$('.photoset-grid').photosetGrid({
rel: $('.photoset-grid').attr("data-id"),
gutter: '0px',

onComplete: function(){
$('.photoset-grid').css({
    'visibility': 'visible'
});
}
});
});
</script>
<!-- /Photoset-grid script -->

Answer 1

这应该拉新帖子并将它们换成新的div.photoset-grid。此时，您只需使用您的设置拨打.photosetGrid()即可。

$('#content').infinitescroll({
    // infinite scroll settings
  }, function(newPosts){
    $(newPosts)
    .wrapAll('<div class="photoset-grid">') //wrap them in place
    .parent() //get .photoset-grid
    .photosetGrid({
        //photoset grid settings
    });
});

以前的回答

在Infinite Scroll的回购中不太清楚，但在 infinite-scroll.com你可以看到第二个例子中的回调。这是部分解决方案使用回调：
$('#content').infinitescroll({
    //settings
  }, function(newPosts){
    //MISSING: reset photosetGrid
    $('.photoset-grid').photosetGrid();
});
不幸的是，它似乎更新了＃34;或＆＃34;重置＆＃34;方法丢失了   对于Photoset Grid，也许open an issue in their repo和希望   如果有人添加了功能，它会及时发生。

或者，您可以查找其他脚本。

如何将无限滚动与Photoset网格相结合？

1 个答案:

以前的回答