Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

jQuery plugin for grabbing next content and appending it to current page.

branch: master

Fetching latest commit…

Cannot retrieve the latest commit at this time

README.md

ajaxPaginationFetch

This is a simple jQuery plugin for appending the next paginated content to the existing page by AJAX. This plug in is inspired by Paul Irish's Infinite Scroll (http://www.infinite-scroll.com/). Think of it as infinite-scroll on demand. You can see it in action on my blog (http://www.joryland.org).

The plug in also adds the ability to scroll the first new item on the page some distance after the content loads. An example use of this would be to scroll the new item to the top.

The plugin is designed to work with CMS's that can provide a "next" link. Ideally the CMS should also suppress the "next" link when there is no more content.

Initialization

Attach the ajaxPaginationFetch function to the element that provides the scope of content you would like to affect, like this:

     $('body').ajaxPaginationFetch(options, callback);

Options

The following options can be passed to the function:

contentSelect: (text string) This will be the jQuery selector that specifies a unit of new content (e.g. the class applied to each blog post)(default: '.item').

appendElem: (text string) This will be the jQuery selector that specifies the element to which the new items will be appended (default: '#content').

paginationNext: (text string) This will be the jQuery selector that specifies the "Next" link. This element should be an anchor tag with an "href" attribute that links to the next page. (default: '#nextLink').

scrollToThere: (boolean) If true, the page will scroll so that the first new item is at the top of the page. (default: true)

scrollSpeed: (integer) Sets the speed (in milliseconds) of the scroll. (default: 500)

scrollSpeed: (integer) Sets the speed (in milliseconds) of the scroll. (default: 500)

scrollOffset: (integer) Sets the distance (in pixels) that the top item should be from the top when it is done scrolling. (default: 0)

Callback

The second argument is whatever function should be executed when the pagination fetch is finished.

Example

    $('body').ajaxPaginationFetch(
        {
        'contentSelect' : '.post',
            'appendElem' : '#blogContent',
            'paginationNext' : '#pagination a',
            'scrollToThere' : true,
            'scrollSpeed' : 500,
            'scrollOffset': -150    
         },
        reBind()
    );
Something went wrong with that request. Please try again.