olink.docbook-xsl.webhelp.docs.ch03s01.html Maven / Gradle / Ivy
Design - - README: Web-based Help from DocBook XML 
README: Web-based Help from DocBook XML
Developer Docs
An overview of webhelp page structure.
DocBook WebHelp page structure is fully built on css-based design abandoning frameset
structure. Overall page structure can be divided in to three main sections
Header: Header is a separate Div which include company logo, navigation
button(prev, next etc.), page title and heading of parent topic.
Content: This includes the content of the documentation. The processing of this
part is done by DocBook
XSL Chunking customization. Few further css-styling applied from
positioning.css.
Left Navigation: This includes the table of contents and search tab. This is
customized using jquery-ui styling.
Tabbed Navigation: The navigation pane is organized in to two tabs. Contents
tab, and Search tab. Tabbed output is achieved using JQuery Tabs plugin.
Table of Contents (TOC) tree: When building the chunked html from the docbook
file, Table of Contents is generated as an Unordered List (a list made from
<ul> <li> tags). When page loads in the browser, we apply
styling to it to achieve the nice look that you see. Styling for TOC tree is done
by a JQuery UI plugin called
TreeView. We can generate the tree easily by following javascript code:
//Generate the tree
$("#tree").treeview({
collapsed: true,
animated: "medium",
control: "#sidetreecontrol",
persist: "cookie"
});
Search Tab: This includes the search feature.
