如何在jQuery Masonry中添加无限滚动条？

我正在尝试将无限滚动与我当前使用jQuery Masonry类型的网站相结合。我试图理解JavaScript（和一般的HTML）的语言和基本功能，但它可能是相当的压倒性的。我也看到不同的方法为网页添加无限滚动，包括使用PHP。基本上，我不知道哪个方法是我网站的最佳方法。任何提示或帮助非常感谢。对于我对这个主题缺乏了解，我表示歉意，但我只是觉得这已经超出了我的想象...... @ _ @如何在jQuery Masonry中添加无限滚动条？

这是我的网站。这是我个人的艺术品收藏： http://themptyrm.com

来源

2013-03-26 user2210202

无限滚动，我已经在我的项目试过一次所以这里有一些到目前为止我已经使用了引用..

https://github.com/paulirish/infinite-scroll

http://www.jquery4u.com/tutorials/jquery-infinite-scrolling-demos/

jScroll是Philip Klauzinski编写的用于无限滚动的jQuery插件。无限滚动;也被称为延迟加载，无尽的滚动，autopager，无尽的页面等;是在向下滚动时在当前页面或内容区域内通过AJAX加载内容的能力。每次滚动到现有内容的结尾时，都可以自动加载新内容，也可以通过单击现有内容末尾的导航链接触发加载。

http://jscroll.com/

希望它能帮助。

来源

2013-03-26 05:38:06

你也可以使用这个... http://www.infinite-scroll.com/inf inite-scroll-jquery-plugin/ – 2013-03-26 05:38:20

在HTML文件中

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
<script src="../jquery.masonry.min.js"></script> 
<script src="../js/jquery.infinitescroll.min.js"></script>

添加此并添加此，在这里你可以指定无限滚动的选项

<script type="text/javascript"> 
var $container = $('#container'); 
$container.infinitescroll({ 
    navSelector : '#page-nav', // selector for the paged navigation 
    nextSelector : '#page-nav a', // selector for the NEXT link (to page 2) 
    itemSelector : '.box',  // selector for all items you'll retrieve 
    loading: { 
     finishedMsg: 'No more pages to load.', 
     img: 'http://i.imgur.com/6RMhx.gif' 
    } 
    }, 
    // trigger Masonry as a callback 
    function(newElements) { 
    var $newElems = $(newElements); 
    $container.masonry('appended', $newElems); 
    } 
); 
</script>

顺便说一下你的页面看起来不错

如果你有更多怀疑走到这里Masonry with Infinite scroll

来源

2013-03-28 19:09:18 ChristianD

我一直在寻找这样的解决方案的年龄。这段代码在改变选择器后立即起作用。 – egr103 2015-06-30 14:35:26

如何在jQuery Masonry中添加无限滚动条？

回答

相关问题