Plugin Daftar Konten Otomatis Sederhana (1 Level)

(function($) {
    $.fn.toc = function(o, p) {
        p = $.extend({title: "Table of Content"}, p);
        this.prepend('<div id="toc-list"><strong>' + p.title + '</strong><ol></ol></div>').children(o).each(function(i) {
            i = i + 1;
            $(this).attr('id', 'section-' + i).nextUntil(o).after('<a href="#toc-list">Top &uArr;</a>');
            $('<li><a href="#section-' + i + '">' + $(this).text() + '</a></li>').appendTo('#toc-list ol');
        });
    };
})(jQuery);

Penggunaan

$('#parent').toc('h3', {title: "Tabel Konten:"});

Demo

Lihat Demo

Menambahkan Efek Animasi

Kode ini berada di luar plugin, dan memiliki cara kerja yang tidak jauh berbeda dengan animasi tombol back to top:

$('#toc-list a, a[href="#toc-list"]').on("click", function() {
    var hash = this.hash;
    $('html, body').animate({scrollTop:$(hash).offset().top}, 600, function() {
        window.location.hash = hash;
    });
    return false;
});

Lihat Demo Edit di Sini