Floating table of contents for your html reports using knitr

If you love knitr and rstudio and use them to produce long reports, you probably know that you can produce a table of contents in your html (and pdf) documents. In the newer rstudio (Version 0.98.801 or later) you do it by requesting a toc in the doc header, something like this.

title: "cssTest"
output:
html_document:
toc: yes

But wouldn’t it be nice if the table of contents, instead of being stuck at the top of the document, was available at the edge of the browser window and doesn’t move when you scroll?

This post shows a live example of a floating toc and also tells you how easily to produce one automatically by adding a custom css file.

Comments and improvements are welcome!