jQuery Plugin For Automatic Table of Contents - toc.js

File Size: 8.13 KB
Views Total: 1344
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
jQuery Plugin For Automatic Table of Contents - toc.js

toc.js is a lightweight jQuery plugin for automatically generating a collapsible Table of Contents that contains anchor links pointing to different content sections of your web page. Great for long content web page that the visitors can jump down the page to the desired section to desired sections easily and quickly.

How to use it:

1. Load jQuery library and the jQuery toc.js plugin's files in the web page.

<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="jquery.toc.js"></script>

2. Wrap your long content into the article tag.


  <h1> Headling 1 </h1>
  <p> ... </p>

  <h2> Headling 2 </h1>
  <p> ... </p>

  <h3> Headling 3 </h3>
  <p> ... </p>


3. That's it. The plugin will auto generate a Table of Contents based on heading tags (h1~h6).

Change log:


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