These are the best free options from font awesome for opening the TOC:

This is the best option for opening the menu bar:

Document! X for Javascript Developers

Automated Javascript Documentation Tool + WYSIWYG Authoring Environment

Document! X delivers the best of both worlds by seamlessly combining automatic documentation of Javascript files (plain Javascript or jQuery plugins / Widgets) with a full WYSIWYG authoring environment. The generated content is an accurate and comprehensive documentation set for your Javascript library covering classes, structures, interfaces, enumerations, constructors, methods, properties, events and fields.

Document! X uses a unique approach to analyzing your javascript that ensures an accurate documentation set regardless of the framework or inheritance pattern you have chosen to use.

Document! X will use any existing Jsdoc or XML format source code comments and you can extend the source descriptions using the rich authoring environment provided by the Document! X Content File Editor.

Content Authoring Options

If you have use Jsdoc comments or XML format comments in your Javascript source code, Document! X can use them automatically; you can view the content of the source comments whilst you are editing in order to easily spot areas that need expansion and avoid duplication.

You can choose to author content in your Jsdoc or XML format source comments, and/or using the rich authoring environment of the Document! X Content File editor. This flexibility allows you to include basic descriptive documentation in the source code and use the feature rich Document! X Content File editor to author extended content.

/@Html.Partial("_ScreenshotGallery", New ScreenshotSetPageViewModel("javascript-authoring", Model.ScreenshotConfiguration.ScreenshotSets("javascript-authoring").Screenshots, ""))

Author Content in Jsdoc or XML format Source Comments

Document! X will use any JsDoc or XML format source comments that exist in the Javascript you are documenting, so you can leverage any existing documentation effort. Adding type information in your source comments will improve the level of documentation Document! X is able to produce for your members.

Sample JsDoc format source comments

/**
* constructs a new myType object
* @constructor
* @param {string} p1 p1 summary
* @param {number} p2 p2 summary
*/
function myType(p1, p2) {

}

/** field summary */
myType.prototype.field = 0;

/**
* method summary
* @param {string} p1 p1 summary
* @returns {number} method returns
*/
myType.prototype.method = function(p1) {

}

Sample XML format source comments

function myType(p1, p2) {
    ///<summary>constructs a new myType object</summary>
    ///<param name="p1" type="string">p1 summary</param>
    ///<param name="p2" type="number">p2 summary</param>
}
 
///<summary>field summary</summary>
myType.prototype.field = 0;
 
///<summary>method summary</summary>
///<param name="p1" type="string">p1 summary</param>
///<returns type="number">method returns</returns>
myType.prototype.method = function(p1) {
}

Object Model Diagrams

Document! X automatically generates object relationship diagrams for your classes. Specific relationships can be ignored where necessary (e.g. a relationship back to a parent object).

Single Source Build and Publish

Your Javascript documentation projects can be generated to Browser Help or CHM (Html Help 1.x). The specific requirements for the different output formats are handled for your automatically and you can build all outputs from a single project. Automatic publishing makes it quick and simple to deploy the generated output to your web site, ftp server or network location.

/@Html.Partial("_ScreenshotGallery", New ScreenshotSetPageViewModel("javascript-build-and-publish", Model.ScreenshotConfiguration.ScreenshotSets("javascript-build-and-publish").Screenshots, ""))