-
Notifications
You must be signed in to change notification settings - Fork 78
andferminiano/jquery-scroll-pagination
Folders and files
Name | Name | Last commit message | Last commit date | |
---|---|---|---|---|
Repository files navigation
Official post in my blog: http://www.andersonferminiano.com/blog/2012/07/jquery-scroll-pagination/ This jQuery Scroll Pagination Plugin was referred by several developer websites as: http://www.jqueryrain.com/2012/04/best-ajax-jquery-pagination-plugin-tutorial-with-example-demo/ http://designsuperstars.net/10-cool-infinite-scrolling-effects-that-can-enhance-your-websites-navigation/ http://www.webdeveloperjuice.com/2012/05/26/10-aggressively-used-jquery-infinite-scroll-plugins-for-endless-paging/ http://social.technet.microsoft.com/Forums/el-GR/sharepoint2010programming/thread/c00d8727-5a83-437e-b88b-52372623ac57 http://hi.baidu.com/isina/item/a8eaa72d7b8a519eb7326330 http://freebiesdesign.com/infinite-scroll-jquery-plugin/ http://simplythebest.net/scripts/cat/106/Data-handling.html http://www.htmldrive.net/items/show/1189/Useful-Scroll-Pagination-with-jQuery http://archive.cnblogs.com/a/2430967/ http://thewebthought.blogspot.com/2012/01/jquery-loading-content-while-user.html Plugin URL: http://andersonferminiano.com/jqueryscrollpagination/ Example of usage: $(function(){ $('#content').scrollPagination({ 'contentPage': 'democontent.html', // the url you are fetching the results 'contentData': {}, // these are the variables you can pass to the request, for example: children().size() to know which page you are 'scrollTarget': $(window), // who gonna scroll? in this example, the full window 'heightOffset': 10, // it gonna request when scroll is 10 pixels before the page ends 'beforeLoad': function(){ // before load function, you can display a preloader div $('#loading').fadeIn(); }, 'afterLoad': function(elementsLoaded){ // after loading content, you can use this function to animate your new elements $('#loading').fadeOut(); var i = 0; $(elementsLoaded).fadeInWithDelay(); if ($('#content').children().size() > 100){ // if more than 100 results already loaded, then stop pagination (only for testing) $('#nomoreresults').fadeIn(); $('#content').stopScrollPagination(); } } }); // code for fade in element by element $.fn.fadeInWithDelay = function(){ var delay = 0; return this.each(function(){ $(this).delay(delay).animate({opacity:1}, 200); delay += 100; }); }; }); Thank you for using it!
About
No description, website, or topics provided.
Resources
Stars
Watchers
Forks
Releases
No releases published
Packages 0
No packages published