Infinite Scroll and Load More Plugin With jQuery - Load More

Just another jQuery infinite scroll & load more plugin that allows you to dynamically load local or external data into current webpage when scrolling down or by clicking on the 'load more' button.

More Examples:

• Load More + JSON
• Load More + Local Data

How to use it:

1. Download and load the JQuery load more plugin's script after loading jQuery library as this:

<script src="//code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="loadmore.js"></script>

2. Apply the infinite scroll functionality on the webpage that loads an external JSON data via AJAX.

<ul class="list" id="list"></ul>
<button id="btn" class="load-btn">Load More...</button>

$("#list").loadJson({
  url: 'images.json',
  loadBtn: '#btn',
  getData: function(elem, data) {
    $.each(data, function(index, value) {
      $(elem).append('<li><img src=' + value['thumbnailUrl'] + '></li>');
    });
  }
});

3. Enable a button to load more content from an external JSON file via AJAX.

<ul class="list" id="list"></ul>
<button id="btn" class="load-btn">Load More...</button>

$("#list").loadJson({
  url: 'images.json',
  loadBtn: '#btn',
  getData: function(elem, data) {
    $.each(data, function(index, value) {
      $(elem).append('<li><img src=' + value['thumbnailUrl'] + '></li>');
    });
  }
});

4. Enable a button to load more content from on-page elements just like an ajax pagination.

<ul class="list" id="list">
  <li><span>1</span></li>
  <li><span>2</span></li>
  <li><span>3</span></li>
  <li><span>4</span></li>
  <li><span>5</span></li>
  <li><span>6</span></li>
  ...
</ul>
<button id="btn" class="load-btn">Load More..</button>

$("#list").loadMore({
  selector: 'li',
  loadBtn: '#btn'
});

5. Full plugin options.

$("#list").loadMore({
  selector: '',
  limit: 3,
  load: 3,
  loadBtn: '', // load button selector
  animate: true,
  animateIn: 'fadeInUp' // animation class
});

---

This awesome jQuery plugin is developed by amrishpal. For more Advanced Usages, please check the demo page or visit the official website.