jQuery Reach Scroll

Actually this plugin will not load new pages and append new elements, it only will work with jQuery events to warn you when the scroll reach the limit of the binder scroll. (Lightweight plugin ~ 3kb minified)

Browser Support


IE 9+ ✔	Latest ✔	Latest ✔	Latest ✔	Latest ✔

Getting started

Three quick start options are available:

Download latest release
Clone the repo: git@github.com:dhyegofernando/jquery-reach-scroll.git
Install with Bower: bower install jquery-reach-scroll

Setup

Use Bower to fetch all dependencies:

$ bower install

Now you're ready to go!

Usage

Create an element to be called:

<ul id="my-list"></ul>

Include jQuery (1.7.0+):

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>

Include JS:

<script src="jquery.reach-scroll.min.js"></script>

Call the plugin:

$("#my-list").reachScroll();

That's it!

Options

Here's a list of available settings.

$("#my-list").reachScroll({
  binder: $(window),
  pause: false,
  pauseIfOccurs: false,
  extraScrollPx: 0,
  onReached: function() {}
});

Attribute	Type	Default	Description
`binder`	DOM/jQuery	`$(window)`	The element that will be bound to the scroll event.
`pause`	Boolean	`false`	Defines the plugin status.
`pauseIfOccurs`	Boolean	`false`	Whether the plugin will be pause after the first reached event.
`extraScrollPx`	Integer	`0`	Extra pixels before reach limit of the binder.
`onReached`	Function	`null`	Function that will be called as event listener on limit of the binder.

You can also set the reached event like that if you prefer:

$("#my-list").on("scrollreached", function() {});

Structure

The basic structure of the project is given in the following way:

.
|-- demo/
|   |-- css
|   |-- js
|   |-- index.html
|-- dist/
|   |-- jquery.reach-scroll.js
|   |-- jquery.reach-scroll.min.js
|-- src/
|   |-- jquery.reach-scroll.js
|-- .editorconfig
|-- .gitignore
|-- .jshintrc
|-- .travis.yml
|-- bower.json
|-- CONTRIBUTING.md
|-- Gruntfile.js
|-- reach-scroll.jquery.json
|-- package.json
`-- README.md