No description, website, or topics provided.
JavaScript
Switch branches/tags
Nothing to show
Latest commit 6dbba09 Jul 28, 2012 1 @andferminiano readme
Permalink
Failed to load latest commit information.
scripts plugin scripts Jul 28, 2012
README readme Jul 28, 2012
democontent.html plugin scripts Jul 28, 2012
index.html readme Jul 28, 2012
jqueryscrollss.jpg plugin scripts Jul 28, 2012
scrollpagination_demo.css plugin scripts Jul 28, 2012

README

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!