「自学哈网」无限滚动无限滚动数据切割插件Infinite Scroll
无限滚动无限滚动数据切割插件Infinite Scroll
无限分页(Infinite Scroll)又称自动分页、滚动分页和无限分页。常用的形式是图片、文章或其他列表的网页,用于滚动页面自动加载下一页的内容。
官方网站:http://www.infinite-scroll.com
Infinite Scroll插件下载址:http://downloads.wordpress.org/plugin/infinite-scroll.zip
方法
Bind
$(‘.selector’).infinitescroll(‘bind’);
Unbind
$(‘.selector’).infinitescroll(‘unbind’);
Destroy
$(‘.selector’).infinitescroll(‘destroy’);
Pause
$(‘.selector’).infinitescroll(‘pause’);
Resume
$(‘.selector’).infinitescroll(‘resume’);
Toggle
$(‘.selector’).infinitescroll(‘toggle’);
Retrieve
$(‘.selector’).infinitescroll(‘retrieve’);
Scroll
$(‘.selector’).infinitescroll(‘scroll’);
Update
$(‘.selector’).infinitescroll(‘update’, {debug: true});
选项:
$(‘.selector’).infinitescroll({
loading: {
finished: undefined,
finishedMsg: “<em>Congratulations, you’ve reached the end of the internet.</em>”,
img: null,
msg: null,
msgText: “<em>Loading the next set of posts…</em>”,
selector: null,
speed: ‘fast’,
start: undefined
},
state: {
isDuringAjax: false,
isInvalidPage: false,
isDestroyed: false,
isDone: false, // For when it goes all the way through the archive.
isPaused: false,
currPage: 1
},
behavior: undefined,
binder: $(window), // used to cache the selector for the element that will be scrolling
nextSelector: “div.navigation a:first”,
navSelector: “div.navigation”,
contentSelector: null, // rename to pageFragment
extraScrollPx: 150,
itemSelector: “div.post”,
animate: false,
pathParse: undefined,
dataType: ‘html’,
appendCallback: true,
bufferPx: 40,
errorCallback: function () { },
infid: 0, //Instance ID
pixelsFromNavToBottom: undefined,
path: undefined, // Can either be an array of URL parts (e.g. [“/page/”, “/”]) or a function that accepts the page number and returns a URL
maxPage:undefined // to manually control maximum page (when maxPage is undefined, maximum page limitation is not work)
});
元素内部滚动示例:
$(‘.selector’).infinitescroll({
behavior: ‘local’,
binder: $(‘.selector’), // scroll on this element rather than on the window
// other options
});
读取JSON数据示例:
$(‘.selector’).infinitescroll({
// other options
dataType: ‘json’,
appendCallback: false
}, function(json, opts) {
// Get current page
var page = opts.state.currPage;
// Do something with JSON data, create DOM elements, etc ..
});
本站所有资源来源于网络,分享目的仅供大家学习和交流!如若本站内容侵犯了原著者的合法权益,可联系邮箱976157886@qq.com进行删除。
自学哈专注于免费提供最新的分享知识、网络教程、网络技术的资源分享平台,好资源不私藏,大家一起分享!
自学哈网 » 「自学哈网」无限滚动无限滚动数据切割插件Infinite Scroll