Easy jQuery AJAX Infinite Scroll Plugin - Yofinity
| File Size: | 72.5 KB |
|---|---|
| Views Total: | 9186 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
Yet another jQuery infinite scroll plugin that simply fetches and appends more content to the end of the content area when user scrolls down the webpage.
How to use it:
1. Include the necessary jQuery library and the jQuery Yofinity plugin on the webpage.
<script src="//code.jquery.com/jquery-1.12.1.min.js"></script> <script src="yofinity.js"></script>
2. Add a load more link at the end of the content area:
<a href="page2.html" title="More Content" rel="next">Loading...</a>
3. Active the infinite scroll plugin.
$('body').yofinity({
success: function ($link, response){
$link.before(response);
$link.attr('href', 'page2.html');
}
});
4. Plugin's default settings.
$('body').yofinity({
// Ajax custom URL to specify if no next button is available (Usefull for WordPress sites with ajax call functions)
ajaxUrl: '',
// Number of pixels to fire infinite scroll
buffer: 1000,
// container
context: window,
// debug mode
debug: false,
// Function called if script fires an error
error: null,
// Function called when script fires loading
loading: null,
// Iterator may be used for pagination, define where to start.
// After each success call, the iterator is autoincremented
iterator: 1,
// Load more selector
navSelector: 'a[rel="next"]',
// Method to send data with
type: 'get',
// Parameters to send in POST or GET method
params: {},
// Function called when script fires success
success: null
});
Change log:
2016-09-25
- new version with ajax URL custom call, new usefull iterator, and params
This awesome jQuery plugin is developed by crewstyle. For more Advanced Usages, please check the demo page or visit the official website.











