jquery.infinitescroll怎么改成点击加载呢
function item_masonry(){
$('.item img').load(function(){
$('.infinite_scroll').masonry({
itemSelector: '.masonry_brick',
columnWidth:226,
gutterWidth:15
});
});
$('.infinite_scroll').masonry({
itemSelector: '.masonry_brick',
columnWidth:226,
gutterWidth:15
});
}
$(function(){
function item_callback(){
$('.item').mouseover(function(){
$(this).css('box-shadow', '0 1px 5px rgba(35,25,25,0.5)');
$('.btns',this).show();
}).mouseout(function(){
$(this).css('box-shadow', '0 1px 3px rgba(34,25,25,0.2)');
$('.btns',this).hide();
});
item_masonry();
}
item_callback();
$('.item').fadeIn();
var sp = 1
$(".infinite_scroll").infinitescroll({
navSelector : "#more",
nextSelector : "#more a",
itemSelector : ".item",
loading:{
img: "{IMG_PATH}dd/masonry_loading_1.gif",
msgText: ' ',
finishedMsg: '没有更多案例了',
},errorCallback:function(){
$("#page").show();
}
},function(newElements){
var $newElems = $(newElements);
$('.infinite_scroll').masonry('appended', $newElems, false);
$newElems.fadeIn();
item_callback();
return;
});
$(window).unbind('.infscr');
// 手动点击的元素
$('#more a').bind("click",function(){
$(document).trigger('retrieve.infscr');
return false;
});
<script type="text/javascript" src="jquery.infinitescroll.js"></script>
<script type="text/javascript" src="jquery.masonry.js"></script>
我改成这个样子但是怎么点击都没反应,也把jquery.infinitescroll里面的scroll改成了click,但是还是没反应求问这是怎么一回事啊
$('.item img').load(function(){
$('.infinite_scroll').masonry({
itemSelector: '.masonry_brick',
columnWidth:226,
gutterWidth:15
});
});
$('.infinite_scroll').masonry({
itemSelector: '.masonry_brick',
columnWidth:226,
gutterWidth:15
});
}
$(function(){
function item_callback(){
$('.item').mouseover(function(){
$(this).css('box-shadow', '0 1px 5px rgba(35,25,25,0.5)');
$('.btns',this).show();
}).mouseout(function(){
$(this).css('box-shadow', '0 1px 3px rgba(34,25,25,0.2)');
$('.btns',this).hide();
});
item_masonry();
}
item_callback();
$('.item').fadeIn();
var sp = 1
$(".infinite_scroll").infinitescroll({
navSelector : "#more",
nextSelector : "#more a",
itemSelector : ".item",
loading:{
img: "{IMG_PATH}dd/masonry_loading_1.gif",
msgText: ' ',
finishedMsg: '没有更多案例了',
},errorCallback:function(){
$("#page").show();
}
},function(newElements){
var $newElems = $(newElements);
$('.infinite_scroll').masonry('appended', $newElems, false);
$newElems.fadeIn();
item_callback();
return;
});
$(window).unbind('.infscr');
// 手动点击的元素
$('#more a').bind("click",function(){
$(document).trigger('retrieve.infscr');
return false;
});
<script type="text/javascript" src="jquery.infinitescroll.js"></script>
<script type="text/javascript" src="jquery.masonry.js"></script>
我改成这个样子但是怎么点击都没反应,也把jquery.infinitescroll里面的scroll改成了click,但是还是没反应求问这是怎么一回事啊
...全文
相关推荐
masonry+infinitescroll实现的瀑布流demo
引入必要的库:在HTML文件中引入jQuery、Masonry和Infinitescroll的库文件。2.
jquery.infinitescroll.js演示示例以及常用参数
```html<script src="path/to/jquery.min.js"></script><script src="path/to/jquery.infinitescroll.min.js
jquery.infinitescroll滑动加载更多
```html<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script><script src="path/to/jquery.infinitescroll.min.js
jQuery masonry和infinitescroll制作带分页的瀑布流插件
Infinitescroll的关键特性包括:1. **无缝加载**:在用户滚动到页面底部时,新内容会自动加载,无需点击“下一页”按钮,提供顺畅的浏览体验。2.
infinitescroll.zip
在网页设计中,无限滚动是一种用户体验优化的策略,它允许用户在不点击“下一页”按钮的情况下,通过滚动页面来加载更多内容。


