无限滚动插件中的回调问题

时间:2011-01-02 17:16:48

标签: jquery jquery-plugins callback

我正在使用一个wordpress网站,该网站使用David DeSandro的jQuery Masonry插件以及Paul Irish的Infinite Scroll插件。有一个无限滚动插件的回调选项来调用Masonry。 Masonry提供了这个功能的两个例子:

$('#secondary').masonry({ appendedContent: $(this) });

$(this).masonry({ appendedContent: $( newElements ) });

但我正面临一个使用它们的奇怪问题。一切都很好,除了似乎每次下一个帖子被提取时,在第一个帖子前面有很多空的空间。对我来说,这个空间似乎与页面“1”的高度相同。 这是代码:

 var $wall = jQuery('#secondary');
 $wall.masonry({ singleMode: true,
 itemSelector: '.box:visible'
  });  

我为Infinte Scroll的回调选项尝试了不同的功能:

 $('#secondary').masonry({ appendedContent: $(this) });   

 $(this).masonry({ appendedContent: $( newElements ) });  

第一个回调代码我得到空的空间和第二个回调代码,Masonry打破回调,第二个页面来自第一个。脚本给我一个错误:newelements as“undefined element”。

我想知道Masonry在第二页而不是第一页中排列所有方框的错误。对我来说,似乎它将第一页元素附加到新元素而不是将新元素附加到当前元素。

但我找不到问题的根源。

请你帮我解决这个问题。

链接到砌体:http://github.com/desandro/masonry/raw/master/jquery.masonry.js
无限滚动也在github上。

谢谢!

修订: 完全无限的代码:

<script type="text/javascript">
 (window.INFSCR_jQ ? jQuery.noConflict() : jQuery)(function($){
 // Infinite Scroll jQuery+Wordpress plugin
 $('#secondary').infinitescroll({
 debug           : false,
 nextSelector    : "div.navigation a:first",
 loadingImg      : "/infinite-scroll/ajax-loader.gif",
 navSelector     : "div.navigation",
 contentSelector : "#secondary",
 itemSelector    : "div.box"
  },function(){ 
 Cufon.replace('li');
 Cufon.replace('h1');
 $('#secondary').masonry({ appendedContent: $(this) }); 
  });
 });   
 </script>

1 个答案:

答案 0 :(得分:0)

我遇到了完全相同的问题。切换到Isotope(需要廉价许可的Masonry的高级版本)为我修复了它。你可以在这里抓住它:http://metafizzy.co/

您可以通过查看当前的问题来解决问题,例如:https://github.com/desandro/masonry/issues#issue/44