jQuery loadMoreButton Plugin

Dieses Plugin teilt den Inhalt einer HTML-Seite in mehrere Abschnitte unter und beim Anklicken dieses Buttons wird ein Abschnitt der HTML-Seite geladen. Anhand vordefinierter Optionen generiert das Plugin einen Button am Ende des Inhalts.

Demo

Wie funktioniert es?

Wir erstellen eine Liste mit mehreren Einträgen und rufen das Plugin mit den entsprechenden Optionen auf.

HTML-Code

<div class="container" id="mycontent">
            <ul class="list-group">
                <li class="list-group-item">Abarth</li>
                <li class="list-group-item">Aixim</li>
                <li class="list-group-item">Alfa Romeo</li>
                <li class="list-group-item">Audi</li>
                <li class="list-group-item">BMW</li>
                <li class="list-group-item">Cadillac</li>
                <li class="list-group-item">Chevrolet</li>.
                .
                .
                .
                .
                .
                .
                .
                .
                .
                .
          </ul>
</div>

JavaScript

$("#myconten").loadMoreBtn({
    items_selector:'.list li',
    items_per_page:5,
    btn_text:'btn btn-s btn-primary',
    btn_cls:'btn ',
    btn_id:'load-more-btn',
    ajaxloader:true
}); 

 Optionen