diff --git a/doc/api_header.html b/doc/api_header.html
index f9eafdc99f7..a133fd3aead 100644
--- a/doc/api_header.html
+++ b/doc/api_header.html
@@ -11,7 +11,7 @@
     }
     #man, #man code, #man pre, #man tt, #man kbd, #man samp {
       font-family:consolas,monospace;
-      font-size:16px;
+      font-size:14px;
       line-height:1.3;
       color:#eee;
       background:#22252a; }
diff --git a/doc/doc.js b/doc/doc.js
index aeb1669e35e..3f092e4c238 100644
--- a/doc/doc.js
+++ b/doc/doc.js
@@ -1,15 +1,63 @@
 $(function() {
-  var $toc = $('#toc');
-  $('h2').each(function() {
-    var
-      $h2 = $(this),
-      $div = $('<div class="toclevel1" />'),
-      $a = $('<a/>')
-        .text($h2.text())
-        .attr('href', '#'+$h2.attr('id'));
+  var count = 0;
+  var cur_level, last_level = 0, html = "";
+  $(":header").filter("h2, h3").each(function(i, el){
+    $(this).attr("id", $(this).text().replace(/\(.*\)$/gi, "").replace(/[\s\.]+/gi, "-").toLowerCase()+"-"+(count++))
+    
+    cur_level = el.tagName.substr(1,1);
+    
+    if(cur_level > last_level){
+      html += "<ul>";
+    } else if (cur_level < last_level){
+      html += "</ul>"
+    }
+    if(i > 0){
+      html += "</li>";
+    }
+    html += '<li>';
+    html += '<a href="#'+$(el).attr("id")+'">'+$(el).text().replace(/\(.*\)$/gi, "")+"</a>";
 
-    $toc.append($div.append($a));
+    last_level = cur_level;
   });
-
+  
+  html += "</ul>";
+  
+  $("#toc").append(html);
+  
+  $("#toc ul li").addClass("topLevel");
+  
+  $("#toc ul li ul").each(function(i, el){
+    $(el).parent().removeClass("topLevel").prepend('<a href="#" class="toggler">+</a>');
+  })
+  
+  $("#toc ul li ul").hide();
+  $("#toc ul li .toggler").bind("click", function(e){
+    var el = $("ul", $(this).parent());
+    if(el.css("display") == "none"){
+      el.slideDown();
+      $(this).text("–");
+    } else {
+      el.slideUp();
+      $(this).text("+");
+    }
+    e.preventDefault();
+    return false;
+  });
+  
+  $('a[href*=#]').click(function() {
+      if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'')
+      && location.hostname == this.hostname) {
+        var $target = $(this.hash);
+        $target = $target.length && $target
+        || $('[name=' + this.hash.slice(1) +']');
+        if ($target.length) {
+          var targetOffset = $target.offset().top;
+          $('html,body')
+          .animate({scrollTop: targetOffset}, 500);
+         return false;
+        }
+      }
+    });
+    
   sh_highlightDocument();
 });
\ No newline at end of file