[英]Can't get Infinite Scroll working. (jQuery Plugin)
我试图使用jQuery插件Infinite-Scroll失败。 我的问题是该插件无法正常工作,什么也没发生,甚至出现控制台错误,一切看起来都还不错。 我需要使用这个插件,因为我将使用另一个插件( jQuery Masonry )及其支持并推荐Infinite-Scroll。 我让Masonry轻松工作,但没有Infinite-Scroll。
因此,我开始在测试页中单独测试Infinite-Scroll,但没有进行任何测试。 有什么帮助吗?
test.html
<!DOCTYPE html>
<html>
<head>
<title>Infinite-Scroll Test</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="jquery.infinitescroll.min.js"></script>
<style>
#container {
width: 600px;
margin: 30px auto;
}
.element {
background: #666;
width: 100px;
height: 500px;
margin: 5px;
float: left;
}
</style>
</head>
<body>
<script>
$(function() {
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 : '.element', // selector for all items you'll retrieve
loading: {
finishedMsg: 'No more pages to load.',
img: 'http://i.imgur.com/6RMhx.gif'
}
});
});
</script>
<div id="container">
<div class="element">
test
</div>
<div class="element">
test
</div>
<div class="element">
test
</div>
<div class="element">
test
</div>
<div class="element">
test
</div>
<div class="element">
test
</div>
<div class="element">
test
</div>
<div class="element">
test
</div>
<div class="element">
test
</div>
<div class="element">
test
</div>
<div class="element">
test
</div>
<div class="element">
test
</div>
<div class="element">
test
</div>
<div class="element">
test
</div>
</div>
<nav id="page-nav">
<a href="next.html"></a>
</nav>
</body>
</html>
next.html
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="container">
<div class="element">
new one
</div>
<div class="element">
new one
</div>
<div class="element">
new one
</div>
<div class="element">
new one
</div>
<div class="element">
new one
</div>
<div class="element">
new one
</div>
<div class="element">
new one
</div>
<div class="element">
new one
</div>
<div class="element">
new one
</div>
<div class="element">
new one
</div>
<div class="element">
new one
</div>
<div class="element">
new one
</div>
<div class="element">
new one
</div>
<div class="element">
new one
</div>
</div>
</body>
</html>
该链接应帮助您进行配置: http : //beaver6813.com/2012/01/selectors-in-infinite-scroll/
我注意到无限滚动站点关闭了。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.