Jquery.ias Example

Hello sir, I am Mohandas. I am from Bangalore. I want you to help me by providing me some information about the jQuery.ias and also give me example of it.

[Kiran Chandar]

As you have asked about the Jquery.ias example, I am giving you some information about it
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.
Infinte 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.

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

<script type="text/javascript">
$(document).ready(function() {
jQuery.ias({
item: '.item',
container: '.listing',
next: '.next',
pagination: false,
delay: 600,
negativeMargin: 10
});
});
</script>