Note: It's best to open up the Demo Details in a webbrowser and a text editor at the same time and display them side by side.
Current functionality:
To turn on and off the table of contents, search for id="tableOfContents" in the HTML and read the instructions.
Always Active Keys:
There are three basic types of menu items which the menu program reacts to:
These are the basics:
<h1>, <h2>, <h3>, <h4>, <h5>, <h6><menu> tagsAll elements of the menu (sub-menu headers, links, and clipboard entries) are placed just below the header of this section but above text. For instance, the menu definition for Duck Duck Go is written below this paragraph in HTML, but is displayed above this paragraph so that all menu elements are shown together.
A shortcut cannot be defined twice within a single head. If a shortcut is defined twice, then an unused shortcut will be assigned.
By default, the English language version of this program is defaulted to have 62 possible shortcuts in this order:
You can define which shortcuts are available and what order they will appear in by changing the JavaScript settings at the top of the JavaScript code. The order of the defined shortcuts matter because when shortcuts are automatically assigned, it picks the next available item in the list. By default, it assigns small letters first, single digit numbers next, and large letters last. In the German version, the Umlauts are after the large letters.
Emojis representing the six different variations can also be customized at the top of the JavaScript code.
If you're missing headers (for instance, if you jump from h2 to h6 like this example), the program will automatically make artificial headers, alerting you to the fact that you have missing headers
I don't know why anyone would want to do this, but yes, it is possible to do both at the same time.
This program treats a header as a first class citizen. That means no matter how much you try to bury the header under other tags, the program will still put it in the menu. The menu doesn't care about the other tags. In this example, our header is buried in a series of bullet points, yet the program still reacts to the header as if it were placed outside of the bullet points (i.e., if you activate the shortcut by pressing the proper letter on the keyboard, the program will jump to that header).
Obviously, you should avoid doing this, but I provide this example to show you how the program works.
These menu links won't work unless you save this html file on your hard drive and create the appropriate files, but it is possible to open local files via the menu. Examples with the exact syntax are provided for your reference.
As shown in the Section "Properly Using HTML Syntax With The Clipboard", HTML is not paragraph friendly. You have to "code" enter marks with the multi-paragraph clipboards. The encoded forms look something like
Techanically, Linux uses one byte with a value of 10 ( ) while Windows uses two bytes with a value of 13 and 10 in that order ( ), but it doesn't matter which version you use because both operating systems accept each other's enter marks, although some programs get a little fussy if you use the wrong enter mark or mix the enter marks. (Text editors usually tell you that you're using the wrong one or are using them mixed.)
This section shows how to properly utilize the HTML syntax within the clipboard. Technically, I'm showing you how to use "escape characters" in HTML, if you need to search for the term on the internet.
As shown in the Section "Lengthy Clipboard Copy Examples", HTML is not paragraph friendly. You have to "code" enter marks with the multi-paragraph clipboards. The encoded forms look something like
Techanically, Linux uses one byte with a value of 10 ( ) while Windows uses two bytes with a value of 13 and 10 in that order ( ), but it doesn't matter which version you use because both operating systems accept each other's enter marks, although some programs get a little fussy if you use the wrong enter mark or mix the enter marks. (Text editors usually tell you that you're using the wrong one or are using them mixed.)
Everything from here and below is for testing. If you change the styles, you can get a good idea of how it will look by coming here.
Standard Text: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Text as code: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.