Tuesday, April 27, 2010

HTML simplified with JQuery: Building a Table of Contents

I recently wrote up a bunch of documentation for my research project Junction. I wanted to build a Table of Contents, but knew I would be editing the text a lot. So I thought I'd write a ToC plugin for JQuery.

A little Googling turned up a few workable plugins, but it turned out to be easier to write my own than to embed someone else's. Not that embedding was hard, just that writing the plugin was very easy.

My implementation builds a table of contents as a set of nested lists, and is generated by scanning the page for header tags (h1, h2, h3).

You can have a look at my code running "live" on that documentation page (http://mobisocial.stanford.edu/?page=junction).

I guess this post also acts as a shameless promotion for Junction, a platform for writing platform-spanning activities. So go check that out.