There are many possible ways of displaying and using the links in the
tree, and they are all configurable by you. The four main folders in this
demo try to show the more relevant variations for a frame-based layout
(for more info see the
on the Web site.
The Photos example node organizes photos and maps. You can
put any other type of document in the tree: HTML, ASP, movies, sounds, etc.
You can even fill the outliner with data from a database or list the files
and directories of a computer drive.
The 3 Types of folders node illustrates the two roles the folder
plays in the TreeView script: it is used to contain others entries, but it
may also be itself a link. Folders with entries inside show the +/- icon,
which is used to expand it or collapse it. Clicking on the folder icon also
expands its contents. For those “linked” folders, clicking on the folder
icon not only expands it but also loads a page. “Europe” and “United States”
in the “Photos example” are linked folders that, when clicked, load maps of
The Targets node shows the different places where the linked page
may be loaded: right frame, blank window, top frame (removes frameset), and
the self frame. Additionaly, instead of an HTTP link, you may have a node in
The Other icons node is a folder with a customized icon, and so
is the document inside of it. Your tree may use a custom icon uniformly (all
folders with same icon, for example) or apply different icons on a node-by-node
The Formats node shows different ways of changing the default
format used for the entries’ text. That is, the default font, size, and so on.
For the “Formats” folder, the colors were specified by embedding HTML tags
within the Title argument of the gLnk function. For more information about
the gLnk function, see Advanced Configuration in the Instructions on the Web site.
For the “CSS Class” link, the the name was enclosed in a <DIV> tag that
points to a predefined style sheet class.
These combinations are just examples of what can be done with Treeview.
Check the documentation and see how to set-up the tree for your particular
site-navigation needs. For more information, see the
on the Web site.