Dynamic Table of Contents Generator With jQuery - nestedToc
File Size: | 6.29 KB |
---|---|
Views Total: | 966 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
nestedToc is a lightweight jQuery plugin for dynamically generating a hierarchical ol
based table of contents from heading tags of a given container.
How to use it:
1. Load jQuery library and the jQuery nestedToc plugin at the end of the document.
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script> <script src="src/jquery-nestedToc.js"></script>
2. Create a container to place the table of contents.
<div class="toc"></div>
3. Initialize the plugin to generate a table of contents based on headling tags found in 'main-content' container ).
$('.toc').nestedToc({ // default: body container: '#main-content' });
4. Style the table of contents whatever you like.
.toc ol { ... } .toc li { ... }
This awesome jQuery plugin is developed by dncrht. For more Advanced Usages, please check the demo page or visit the official website.