jQuery Infinite Ajax Scroll Plugin - ias.js

jQuery Infinite Ajax Scroll Plugin - ias.js
File Size: 62.9 KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

ias.js is a jQuery plugin that helps you create infinite scrolling effect with ajax technique for loading more items of your page when scroll down. 

Infinite Scroll is an awesome and powerful effect that applied to many modern websites like pinterest, facebook, twitter and etc. It provides a basic mechanism for triggering more contents to be loaded when the bottom of the page is reached.

You might also like:

Basic Usage:

1. Add the latest jQuery library and ias.js to your head section of the page

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery-ias.js"></script>

2. Include jQuery IAS CSS

<link rel="stylesheet" type="text/css" href="jquery.ias.css" />

3. Markup Html Structure

<div id="content">
<div class="listing">
<div class="post"> <strong>item 1</strong>
<p>...</p>
</div>
<div class="post"> <strong>item 2</strong>
<p>...</p>
</div>
...
</div>
<div class="navigation">
<ul>
<li>1</li>
<li class="next-posts"><a href="page2.html">2</a></li>
</ul>
</div>
</div>

4. Initialize the plugin with options.

$(document).ready(function() {
  jQuery.ias({
    item: '.item',
    container: '.listing',
    next: '.next',
    pagination: false,
    delay: 600,
    negativeMargin: 10,
    initialize: true
  });
});

Changelog:

v2.3.2 (2018-06-05)

v2.2.3 (2018-03-15)

  • Improved documentation
  • Fix: Cannot read property 'Deferred' of undefined (in jQuery noConflict mode) 
  • Small tweaks

v2.2.2 (2017-06-23)

  • Fix: render callback is not executed when using a custom render function 
  • Fix: unpredictable behaviour when multiple instances used the same selectors for sub-elements
  • Stop ajax responder if instance was destroyed or reinitialized
  • Code tweaks

v2.2.1 (2016-06-16)

  • Fix: prevent multiple initialisations causing duplicate items
  • Fix scoping bug in container getter
  • Stop ajax responder if instance was destroyed or reinitialized

v2.2.0 (2015-01-16)

  • Improved documentation on delay and negativeMargin options
  • Added FAQ to support documentation
  • Added Wordpress cookbook
  • Fix: Maintain history state object when changing pages (longzheng)
  • Fix: no longer caching $itemsContainer (fixes #153)
  • Fix: really destroy instance on destroy method (fixes #160)
  • Fix: Replaced deprecated size() with .length (fixes #162)
  • Fix: Reworked binding and unbinding (fixes various issues with unbinding)
  • Fix: Bail out when device doesn't support onScroll event (like Opera Mini) (fixes #146 by fflewddur)
  • Added reinitialize method

v2.1.3 (2014-10-03)

  • Improve compatibility support when Prototype is used along with jQuery

v2.1.1 (2014-05-14)

  • Changed argument of load event from url to event object
  • Fixed prev() return value

v2.1.0 (2014-02-23)

  • Added History extension
  • Added ready event
  • Added loaded event (load is now triggered before loading starts)
  • Added rendered event (render is now triggered before rendering starts)
  • Added priority to callbacks
  • Added initialize call for extensions
  • Added one method

v2.0.0 (2014-02-01)

  • Completely rewritten
  • Extensible through extensions
  • Extensible through events
  • Added an extensive test suite

v1.1.0 (2014-01-29)

  • Typo and spelling fixes (threshold)
  • Added customTriggerProc
  • Fixed triggerPageThreshold when zero
  • Added onScroll event
  • Improved compatibility with jQuery 1.4
  • Fixed noneLeft

This awesome jQuery plugin is developed by webcreate. For more Advanced Usages, please check the demo page or visit the official website.