Automatic Table Of Contents Plugin with jQuery - sdscrollmenu

File Size: 6.16 KB
Views Total: 911
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Automatic Table Of Contents Plugin with jQuery - sdscrollmenu

sdscrollmenu is a lightweight jQuery table of contents plugin for automatically generating a sticky side navigation from heading tags that features smooth scroll, title / link highlighting, scroll spy and responsive layout.

See also:

How to use it:

1. Load jQuery library and the jQuery sdscrollmenu plugin at the end of the document.

<script src="//"></script>
<script src="jquery.sdScrollMenu.js"></script>

2. Call the plugin to generate a sticky table of contents from heading tags within the container 'target'.


3. Config the table of contents.


  // width of the table of contents
  width: 150,

  // scroll speed
  scrollDuration: 500,

  // heading tags
  titles: 'h1, h2, h3, h4, h5, h6',

  // highlight duration
  highlightDuration: 1000,

  // highlight color
  highlightColor: '#146'


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