插件 jQuery.endless scroll 中文API文档

🌙
手机阅读
本文目录结构

插件 jQuery.endless scroll 中文API文档 https://github.com/fredwu/jquery-endless-scroll

Endless Scroll endorse

If you encounter problems with scrolling up, please use the old 1.6.0 release. The code base is currently being rewritten on the 2.0-rewrite branch.

If you don’t already know, endless scrolling (or infinite scrolling or pagination) is a popular technique amongst modern websites such as Google Reader and Live Image Search, whereby instead of paging through items using traditional pagination links, the page just keeps loading with new items attached to the end.

Endless Scroll not only helps you build highly customisable infinite scrolling effects, it also offers features not commonly seen. Such features include:

  • The ability to up-scroll and prepend content to the beginning of the page
  • The ability to limit the number of available ‘pages’, i.e. data truncation
  • And there are more exciting features in the works, including SEO-friendly URLs!

Configuration

There are a few options to customise the behaviour of this plugin:

Option Type Description
pagesToKeep Integer The number of 'pages' to keep before either end of the scrolling content are discarded, by default (value set to `null`) no content will be discarded.
inflowPixels Integer The number of pixels from the boundary of the element that triggers the event.
fireOnce Boolean Only fire once until the execution of the current event is completed.
fireDelay Integer Delays the subsequent firing, in milliseconds, 0 or false to disable delay.
loader String The HTML to be displayed during loading.
content String or Function Plain HTML content to insert after each call, can be either a string or a function that returns a string, when passed as a function it accepts three arguments:
  • fireSequence the number of times the event triggered during the current page session
  • pageSequence a positive or negative value that represents the scroll direction sequence
  • scrollDirection a string of either 'prev' or 'next'
insertBefore String jQuery selector syntax: where to put the loader as well as the plain HTML data.
insertAfter String jQuery selector syntax: where to put the loader as well as the plain HTML data.
intervalFrequency Integer Set the frequency of the scroll event checking, the larger the frequency number, the less memory it consumes - but also the less sensitive the event trigger becomes.
ceaseFireOnEmpty Boolean Ceases fire automatically when the content is empty, set it to `false` if you are using `callback` instead of `content` for loading content.
resetCounter Function Resets the fire sequence counter if the function returns true, this function could also perform hook actions since it is applied at the start of the event.
callback Function Callback function, accepts three arguments:
  • fireSequence the number of times the event triggered during the current page session
  • pageSequence a positive or negative value that represents the scroll direction sequence
  • scrollDirection a string of either 'prev' or 'next'
ceaseFire Function Stops the event (no more endless scrolling) if the function returns true, accepts three arguments:
  • fireSequence the number of times the event triggered during the current page session
  • pageSequence a positive or negative value that represents the scroll direction sequence
  • scrollDirection a string of either 'prev' or 'next'

Usage

// using default options
$(window).endlessScroll();
// using some custom options
$("#images").endlessScroll({
  fireOnce: false,
  fireDelay: false,
  loader: '<div class="loading"><div>',
  callback: function(p){
    alert("test");
  }
});

Custom Loader Styles

You may customise the look and feel of the loader by changing:

  • .endless_scroll_loader (class, for all Endless Scroll loaders);
  • Or #endless_scroll_loader_<scroller_dom_html_id> (id, for the specific loader).

Custom Style for the Most Recently Loaded Content

The most recently loaded content is wrapped in #endless_scroll_content_current.

Demo

Click here for a simple demo.

CoffeeScript and JavaScript

Endless Scroll, starting from v1.6.0 is written in CoffeeScript. To contribute and/or modify the source code, please edit src/jquery.endless-scroll.coffee and recompile the JavaScript. To include Endless Scroll in your webpage, please use the compiled js/jquery.endless-scroll.js.

The command for automatically compiling to JavaScript is:

coffee -w -b -o js/ -c src/

Browser Support

All modern browsers (Firefox, Chrome, Safari, Opera, IE7+) should be supported. Please open an issue if Endless Scroll doesn’t work on a particular browser.

Changelog

v1.8.0 [2012-04-17]

  • Added ceaseFireOnEmpty.
  • Added pagesToKeep.
  • Fixed $(window) uses.

v1.7.1 [2012-04-16]

  • Added scrollDirection to the callback arguments.
  • Fixed the demo.

v1.7.0 [2012-04-16]

  • Endless Scroll now supports infinite up-scrolling!
  • Renamed bottomPixels option to inflowPixels.
  • Added insertBefore option.
  • Added pageSequence to the callback arguments.
  • Fixed the unreliable #endless_scroll_content_current wrapper.

v1.6.0 [2012-04-15]

  • Refactored the code using CoffeeScript.
  • Renamed data option to content.
  • Tweaked the demo page.

v1.5.1 [2012-03-08]

  • Added fireSequence argument to ceaseFire.
  • Added a ceaseFire example to the demo page.
  • Fixed loader.

v1.5.0 [2012-03-08]

  • Added intervalFrequency option.
  • Endless Scroll should now consume less memory in most situations.

v1.4.8 [2011-11-18]

  • Refactored default options merge to avert side effects.

v1.4.7 [2011-11-08]

  • Compatibility fix for IE7 and IE8.

v1.4.6 [2011-10-26]

  • Fixed an issue with inner_wrap and the first scroll event.

v1.4.5 [2011-09-25]

  • ceaseFire now works as expected during a scroll event.

v1.4.4 [2011-06-28]

  • The AJAX loader should be removed when there’s no more results to load.

v1.4.3 [2011-06-28]

  • The data option now accepts a fireSequence argument too.

v1.4.2 [2011-01-08]

  • Fixed a bug where calling the script on $(document) would fail.

v1.4.1 [2010-06-18]

  • Fixed a bug where the callback fires when the inner wrap hasn’t been created.

v1.4 [2010-06-18]

  • Endless Scroll now works with any elements, not just $(document)!

v1.3 [2009-04-20]

  • Fixed a bug caused by fireDelay.

v1.2 [2009-01-16]

  • Added resetCounter option.

v1.1 [2009-01-15]

  • Added fireDelay option.

v1.0 [2009-01-15]

  • Initial release.

More jQuery Plugins

Check out my other jQuery plugins:

  • Inline Confirmation - One of the less obtrusive ways of implementing confirmation dialogues.
  • Slideshow Lite - An extremely lightweight slideshow plugin for jQuery.

License

Copyright (c) 2008-2012 Fred Wu

Dual licensed under the MIT and GPL licenses.

Bitdeli Badge

AXIHE / 精选资源

浏览全部教程

面试题

学习网站

前端培训
自己甄别

前端书籍

关于朱安邦

我叫 朱安邦,阿西河的站长,在杭州。

以前是一名平面设计师,后来开始接接触前端开发,主要研究前端技术中的JS方向。

业余时间我喜欢分享和交流自己的技术,欢迎大家关注我的 Bilibili

关注我: Github / 知乎

于2021年离开前端领域,目前重心放在研究区块链上面了

我叫朱安邦,阿西河的站长

目前在杭州从事区块链周边的开发工作,机械专业,以前从事平面设计工作。

2014年底脱产在老家自学6个月的前端技术,自学期间几乎从未出过家门,最终找到了满意的前端工作。更多>

于2021年离开前端领域,目前从事区块链方面工作了