Sandbox: JavaScript

Fires an element's Ajax delegator when that element is scrolled to.

Example

Scroll to the bottom of the page to see it in action. The InfiniteScroll behavior is AJAXed in, and looks like this:
    <ul>
      <li>
        lots of elements
      </li>
    </ul>
    <div class="pagination-target">
      <a href="path_to_your_next_page_of_content" data="
          'trigger': "Ajax Stop",
          'ajax-target': '!body div.pagination-target',
          'ajax-options': {
            'action': 'replace',
            'target': '!body div.pagination-target'
            'useSpinner': true
          },
          'behavior': 'InfiniteScroll',
          'infinitescroll-options': {
            'ajaxElement': 'self',
            'ajaxElementOffset': 15
          }
        }
        "
      >
        Next
      </a>
    </div>
  
Each AJAX response includes additional content and a behavior that replaces the previous behavior. InfiniteScroll is a simplified version of Affix, and uses ajaxElement and ajaxElementOffset as Affix's affixAtElement[top][element] and affixAtElement[top][offset].

Behavior Options

These options apply only to the data- tag invocation.

Name type default description
ajaxElement String The element that has an AJAX delegator.
ajaxElementOffset Number The scroll offset from the ajaxElement to fire the AJAX delegator.
monitor String !body The element to monitor for scrolling
classNames Object See classNames on BS.Affix