139 lines
5.5 KiB
HTML
Executable File
139 lines
5.5 KiB
HTML
Executable File
<!--
|
|
(Please keep all copyright notices.)
|
|
This frameset document includes the Treeview script.
|
|
Script found at: http://www.treeview.net
|
|
Author: Marcelino Alves Martins
|
|
|
|
Instructions:
|
|
- Follow the steps labeled SECTION1, SECTION2, etc. in this file
|
|
-->
|
|
|
|
|
|
<html>
|
|
|
|
<head>
|
|
|
|
<!-- SECTION 1 -->
|
|
<style>
|
|
/* styles for the tree */
|
|
SPAN.TreeviewSpanArea A {
|
|
font-size: 10pt;
|
|
font-family: verdana,helvetica;
|
|
text-decoration: none;
|
|
color: black
|
|
}
|
|
SPAN.TreeviewSpanArea A:hover {
|
|
color: '#820082';
|
|
}
|
|
/* rest of the document */
|
|
BODY {background-color: white}
|
|
TD {
|
|
font-size: 10pt;
|
|
font-family: verdana,helvetica;
|
|
}
|
|
</style>
|
|
|
|
|
|
|
|
<!-- SECTION 2: Replace everything (HTML, JavaScript, etc.) from here until the beginning
|
|
of SECTION 3 with the pieces of the head section that are needed for your site -->
|
|
|
|
<script>
|
|
//This script is not related with the tree itself, just used for my example
|
|
function getQueryString(index)
|
|
{
|
|
var paramExpressions;
|
|
var param
|
|
var val
|
|
paramExpressions = window.location.search.substr(1).split("&");
|
|
if (index < paramExpressions.length)
|
|
{
|
|
param = paramExpressions[index];
|
|
if (param.length > 0) {
|
|
return eval(unescape(param));
|
|
}
|
|
}
|
|
return ""
|
|
}
|
|
</script>
|
|
|
|
<!-- SECTION 3: These four scripts define the tree, do not remove-->
|
|
<script src="ua.js"></script>
|
|
<script src="ftiens4.js"></script>
|
|
<script src="demoFramelessHiliNodes.js">
|
|
</script>
|
|
</head>
|
|
|
|
|
|
<!-- SECTION 4: Change the body tag to fit your site -->
|
|
<body bgcolor=white leftmargin=0 topmargin=0 marginheight="0" marginwidth="0" onResize="if (navigator.family == 'nn4') window.location.reload()">
|
|
|
|
|
|
<!-- SECTION 5: Replace all the HTML from here until the beginning of SECTION 6 with the pieces of the head section that are needed for your site -->
|
|
|
|
<MAP NAME="ButtonsMap">
|
|
<AREA SHAPE="rect" ALT="Home" COORDS="297,0,340,23" HREF="http://www.treeview.net/" target=_top>
|
|
<AREA SHAPE="rect" ALT="Demo" COORDS="352,0,402,23" HREF="http://www.treeview.net/treemenu/demos.asp" target=_top>
|
|
<AREA SHAPE="rect" ALT="Download" COORDS="417,0,487,23" HREF="http://www.treeview.net/treemenu/download.asp">
|
|
<AREA SHAPE="rect" ALT="Install" COORDS="507,0,550,23" HREF="http://www.treeview.net/treemenu/instructions.asp" target=_top>
|
|
<AREA SHAPE="rect" ALT="Visual Build" COORDS="570,0,650,23" HREF="http://www.treeview.net/treemenu/treeview_builder.asp" target=_top>
|
|
<AREA SHAPE="rect" ALT="FAQ" COORDS="670,0,694,23" HREF="http://www.treeview.net/treemenu/faq.asp" target=_top>
|
|
<AREA SHAPE="rect" ALT="Contact" COORDS="712,0,767,23" HREF="http://www.treeview.net/treemenu/contact.asp" target=_top>
|
|
</MAP>
|
|
|
|
<table cellpadding=0 cellspacing=0 border=0 width=772><tr><td width=772>
|
|
<img src=http://www.treeview.net/treemenu/layout/topbar_menustrip.gif width=772 height=24 USEMAP="#ButtonsMap" border=0></td></table>
|
|
|
|
|
|
<table cellpadding=0 cellspacing=0 border=0 width=772>
|
|
<tr>
|
|
<td width=178 valign=top>
|
|
<table cellpadding=4 cellspacing=0 border=0 width=100%><tr><td bgcolor=#ECECD9>
|
|
<img src=http://www.treeview.net/treemenu/layout/t.gif width=170 height=1><br>
|
|
<table cellspacing=0 cellpadding=2 border=0 width=100%><tr><td bgcolor=white>
|
|
|
|
<!-- SECTION 6: Build the tree. -->
|
|
|
|
<!-- By making any changes to this code you are violating your user agreement.
|
|
Corporate users or any others that want to remove the link should check
|
|
the online FAQ for instructions on how to obtain a version without the link -->
|
|
<!-- Removing this link will make the script stop from working -->
|
|
<table border=0><tr><td><font size=-2><a style="font-size:7pt;text-decoration:none;color:silver" href=http://www.treemenu.net/ target=_blank>Javascript Tree Menu</a></font></td></table>
|
|
|
|
<span class=TreeviewSpanArea>
|
|
<script>initializeDocument()</script>
|
|
<noscript>
|
|
A tree for site navigation will open here if you enable JavaScript in your browser.
|
|
</noscript>
|
|
</span>
|
|
|
|
<!-- SECTION 7: Continuation of the body of the page, after the tree. Replace whole section with
|
|
your site's HTML. -->
|
|
|
|
</td></tr></table></table>
|
|
</td>
|
|
<td bgcolor=white valign=top>
|
|
<table cellpadding=10 cellspacing=0 border=0 width=100%><tr><td>
|
|
|
|
<script>
|
|
//This code is only needed for the demo, not for your site
|
|
var picURL
|
|
picURL = getQueryString(0)
|
|
if (picURL.length > 0)
|
|
document.write("<img src=http://www.treeview.net/treemenu/demopics/" + picURL + "><br><br>");
|
|
</script>
|
|
|
|
<h4>Testing highlight of selected node (and show-all display)</h5>
|
|
This demo is based on the <A HREF="demoFrameless.html"><B>Frameless Layout demo</B></A>. Check that demo first for more information on frameless layout configurations.<p>
|
|
|
|
Two options are being tested here: the selected-node highlight (HIGHLIGHT) and the opening of the tree with all branches expanded (STARTALLOPEN.) These variables can be set on or off independently of each other. They also work just as well with frame-based layouts. They are only being set on together here for the purposes of demonstration.<p>
|
|
|
|
Note how clicking on nodes that are themselves connected to pages (such as Unites States) highlights the text of the node. Clicking on the +/- sign or on a node that does not load a page (such as Europe) does not highlight it.<p>
|
|
|
|
Note also that, in the case of this demo, the page loads with all nodes visible. Some webmasters prefer it that way. Not recommended for very large trees.
|
|
|
|
</td></table></td></table>
|
|
|
|
</body>
|
|
</html>
|