JavaScript DHTML/GUI Components/Documentation

Материал из Web эксперт
Перейти к: навигация, поиск

Tree for documentation

   <source lang="html4strict">

<html> <head> <style type="text/css"> /**

colors, backgrounds, borders, link indication 
    • /

body {

 background: #fff;
 color: #000;

}

  1. main {
 border-top: 1px solid #999;

}

  1. banner {
 background-color: #fff

}

  1. banner {
 border-top: 1px solid #369;

}

  1. poweredby {
 display: block;
 float: left;
 height: 38px;
 width: 102px;
 background: url(../treeimages/poweredb.gif) no-repeat;
 border-bottom: none;

}

  1. ee, #cn {
 border: none;

}

  1. collabnet {
 background-color: #222; 
 color: #fff; 
 border-bottom: 1px solid #000;

}

  1. cnlogo {
 display: block;
 height: 15px;
 width: 150px;
 background: url(../treeimages/product_.gif) no-repeat;
 border-bottom: none;
 vertical-align: top;

} /*Tab sets*/ .tabs td, .tabs th {

 background-image: url(../treeimages/nw_min00.gif);
 background-repeat: no-repeat;

} .tabset {

 background-color: #eee;
 border-bottom: 1px solid #888;
 border-right: 1px solid #888;

} .tabset .tabset {

 border: 1px solid #ccc;
 border-top: 5px solid #ddd;

} .tabset .tabs th {

 background-color: #ddd;
 border-left: 1px solid #eee;

} .tabset .tabs td {

 border-left: 1px solid #eee;

} .tabset .tabs td, .tabset .tabs th {

 background-image: url(../treeimages/nw_min_e.gif);
 background-repeat: no-repeat;

} /*Navigation*/ .navgroup dd li, #projecttools div, #communitytools div {

 background-image: url(../treeimages/strich00.gif);
 background-repeat: no-repeat;
 background-position: .5em .5em;

} .navgroup dd li.header {

 background-image: none;

} .navgroup {

 background: #efefef;

} .navgroup dt {

 border-bottom: 1px solid #666;
 border-right: 1px solid #666;
 background: #ddd;
 color: #555;

} .navgroup dd {

 border-right: 1px solid #aaa;
 border-bottom: 1px solid #aaa;

}

  1. helptext dt {
 background-image: url(../treeimages/icon_hel.gif);
 background-repeat: no-repeat;
 background-position: 97%;

}

  1. helptext {
 background-color: #ffc;

}

  1. helptext dt {
 border-bottom: 1px solid #996;
 border-right: 1px solid #996;
 background-color: #cc9;

}

  1. helptext dd {
 border-bottom: 1px solid #cc9;
 border-right: 1px solid #cc9;

}

  1. mytools dt, #projecttools dt, #admintools dt, #communitytools dt {
 background-color: #ddd;
 border: none;

} .navgroup dl dt {

 background-color: #fff !important;

} .navgroup dl dd {

 border: none !important;

}

  1. mytools dd, #projecttools dd, #admintools dd, #communitytools dd {
 background-color: #fff;
 border-right: none;
 border-bottom: none;
 border-top: 1px solid #999;

}

  1. mytools, #projecttools, #admintools, #communitytools {
 background-color: #ddd;
 border-right: 1px solid #666;
 border-bottom: 1px solid #666;

} /*Functnbars*/ .functnbar {

 background-image: url(../treeimages/nw_maj_r.gif);
 background-repeat: no-repeat;

} .functnbar, .functnbar2 {

 background-color: #aaa;

} .functnbar2 {

 background-image: url(../treeimages/sw_maj_r.gif);
 background-repeat: no-repeat;
 background-position: bottom left;

} .functnbar3 {

 background-color: #ddd;
 background-repeat: no-repeat;
 background-image: url(../treeimages/sw_maj_r.gif);
 background-position: bottom left;

} .functnbar4 {

 background-color: #888;

} .tabset .functnbar {

 background-image: url(../treeimages/nw_maj_s.gif);

} .tabset .functnbar2, .tabset .functnbar3 {

 background-image: url(../treeimages/sw_maj_s.gif);

} /*Links*/ a:link, #navcol a:link, #navcol a:visited, #bodycol a:link, #tasknav a:link, .tasknav a:visited {

 color: #03c;

} a:visited, #helptext a:visited, #bodycol a:visited {

 color: #609;

} .tasknav a:visited {

       color: #03c !important;

} a:link.selfref, a:visited.selfref {

 color: #555 !important;
 text-decoration: none;

} a:active, a:hover, #navcol a:active, #navcol a:hover {

 color: #f30 !important;

} .functnbar4 a, .functnbar4 a:link, .functnbar4 a:visited {

 color: #fff !important;

}

  1. navcol a, #breadcrumbs a {
 text-decoration: none;

} /*Tables*/ .a td, .a, #rightcol div.siteinfo .a {

 background: #ddd;

} .b td, .b, #rightcol div.siteinfo .b {

 background: #efefef;

} table td.c, .c {

 background: #bbb;

} th, .docs th {

 background-color: #bbb;

} .axial th {

 background-color: #ddd;
 color: black;

} body .grid td {

 border-top: 1px solid #ccc;
 border-left: 1px solid #ccc;
 background-color: transparent;

} .legend th, .bars th {

 background-color: #fff;

} /*Messaging*/ .errormessage, .warningmessage, .donemessage, .infomessage {

 border-top: 5px solid #900;
 border-left: 1px solid #900;
 background-image: url(../treeimages/icon_err.gif);
 background-repeat: no-repeat;
 background-position: 5px 1.33em;

} .warningmessage {

 background-image: url(../treeimages/icon_war.gif);
 border-color: #c60;

} .donemessage {

 background-image: url(../treeimages/icon_suc.gif);
 border-color: #090;

} .infomessage {

 background-image: url(../treeimages/icon_inf.gif);
 border-color: #069;

} .errormark, .warningmark, .donemark, .infomark {

 background: url(icon_ers.gif) no-repeat;

} .warningmark {

 background-image: url(icon_was.gif);

} .donemark {

 background-image: url(icon_sud.gif);

} .infomark {

 background-image: url(icon_ing.gif);

} /*Widgets*/ .colbar {

 background: #eee;
 border-color: #999 #eee #eee #999;
 border-width: 1px;
 border-style: solid;

}

  1. breadcrumbs {
 border-top: 1px solid #fff;
 background-color: #ccc;

} fieldset {

   border-color: #ccc #999 #999 #ccc;
   border-width: 1px;
   border-style: solid;

} img {

 border: none;

} .expandedwaste {

 background: url(expanded.gif) no-repeat;
 background-position: .2em .2em;

} .collapsedwaste {

 background: url(collapse.gif) no-repeat;
 background-position: .2em .2em;

} .filebrowse .expanded, .filebrowse-alt .expanded {

 background-image: url(expanded.gif);
 background-repeat: no-repeat;
 background-position: .2em .2em;

} .filebrowse .collapsed, .filebrowse-alt .collapsed {

 background-image: url(collapse.gif);
 background-repeat: no-repeat;
 background-position: .2em .2em;

} .filebrowse .leafnode, .filebrowse-alt .leafnode {

 background-image: url(icon_fol.gif);
 background-repeat: no-repeat;

} .filebrowse .leaf, .filebrowse-alt .leaf {

 background-image: url(icon_doc.gif);
 background-repeat: no-repeat;

} .sortup {

 background: url(icon_sor.gif) no-repeat;

} .sortdown {

 background: url(icon_sos.gif) no-repeat;

} a.collapsedwaste {

 background: url(collapse.gif) no-repeat;
 border: none;

} a.expandedwaste, a.collapsedwaste, a.sortdown, a.sortup, a.expanded, a.collapsed, a.leaf, a.leafnode {

 border: none;

} .docinfo {

 background: url(icon_dod.gif) no-repeat;

} .dirinfo {

 background: url(icon_fom.gif) no-repeat;

} .helplink {

 cursor: help;

}

  1. topmodule {
 background-color: #ddd;
 border-top: 1px solid #fff;
 border-bottom: 1px solid #aaa;

}

  1. topmodule #projectname {
 border-right: 2px solid #aaa;

}

  1. topmodule #issueid {
 border-right: 1px solid #aaa;

}

  1. topmodule td {
 padding: 2px 8px;

} .cvsdiff, .cvsblame {

 background-color: #ccc;

} .cvsdiffadd {

 background-color: #afa;

} .cvsdiffremove {

 background-color: #faa;

} .cvsdiffchanges1, .cvsdiffchanges2 {

 background-color: #ff7;

}

  1. rightcol div.www, #rightcol div.help {
 border: 1px solid #ddd;

}

  1. rightcol div.siteinfo h2 {
 background-color: #bbb !important;

} .band1 {

 color: #fff;
 background-color: #663;

} .band2 {

 color: #fff;
 background-color: #66C;

} .band3 {

 background-color: #C99;

} .band4 {

 background-color: #CFF;

} .band5 {

 color: #fff;
 background-color: #336;

} .band6 {

 color: #fff;
 background-color: #966;

} .band7 {

 background-color: #9CC;

} .band8 {

 background-color: #FFC;

} .band9 {

 color: #fff;
 background-color: #633;

} .band10 {

 color: #fff;
 background-color: #699;

} .band11 {

 background-color: #CC9;

} .band12 {

 background-color: #CCF;

} .band13 {

 color: #fff;
 background-color: #366;

} .band14 {

 color: #fff;
 background-color: #996;

} .band15 {

 background-color: #99C;

} .band16 {

 background-color: #FCC;

} .red {

 color:#f00;
 }

.green {

 color:#060;

} .blue {

 color:#036;

} .purple{

 color:#339;

}

/*Headings*/ h1 em {

 color: #777;

} .h3 h3, .h4 h4 {

 background-color: #fff;

} .tabset .h3 h3, .tabset .h4 h4 {

 background-color: #eee;

} .h2 {

 border-left: 1px solid #333;

} .h3, .h4 {

 border-top: 3px solid #666;
 border-left: none;

} .h4 {

 border-top: 1px solid #666;
 border-left: none;

} .h2 h2 {

 color: #fff;
 background-color: #333;

} .h2 h2 a:link, .h2 h2 a:visited {

 color: #fff !important;
 text-decoration: underline;

} /*Tabs*/ .tabs th {

 border-right: 1px solid #333;
 background-color: #eee;
 color: #fff;
 border-left: 1px solid #fff;

}

  1. toptabs th {
 background-color: #ddd;

}

.tabs td {

 background-color: #999;
 border-right: 1px solid #fff;
 border-left: 1px solid #fff;

} .tabs th, .tabs th a:link, .tabs th a:visited {

 color: #555 !important;

} .tabs td, .tabs td a:link, .tabs td a:visited {

 color: #fff !important;

}

  1. toptabs {
 background-color: #fff;
 border-bottom: 6px solid #ddd;

} /*Calendar*/ .calendarweek {

 background-color: #ccc;

} .calendarweeklabel {

 background-color: #aaa;

} .calendardays, calendarperiod {

 border: 1px solid #999;

} .calendardays table, .calendarperiod table {

 background-color: #ccc;
 }

.calendarmonths {

 background-color: #9bf;
 border-color: #ccf #69c #69c #ccf;
 border-width: 1px;
 border-style: solid;

} .calendartoday {

 background-color: #ee9;
 border-color: #999 #777 #69c #aaa;
 border-width: 1px;
 border-style: solid;

} .periodax, .periodbx, .currentperiod {

 border-bottom: 1px solid #eee;

} .periodax {

 background-color: #9cc;

} .periodbx {

 background-color: #ac9;

} .currentperiod, #today {

 background-color: #ee9;

} .othermonthday, .othermonthday a {

 background-color: #ddd;
 color: #888;

} .calendarday {

 background-color: #fff;

} /**

font and text properties, exclusive of link indication, alignment, text-indent 
    • /

body, input, select {

 font-family: Verdana, Helvetica, Arial, sans-serif;

} code, pre {

 font-family: "Andale Mono", Courier, monospace;

} body, pre, code {

 font-size: x-small;
 voice-family: "\"}\"";
 voice-family: inherit;
 font-size: small;

}

  1. bodycol, #bodycol table td, #bodycol table th {
 font-size: 95%;
 line-height:135%;

}

  1. bodycol table table td, #bodycol table table th {
 font-size: 100%;

} /* a workaround for netscape 7 bug. has to come right after the previous line-height declaration */ input {

 line-height:100%;

} h1 {

 font-weight: normal;
 font-size: medium;
 voice-family: "\"}\"";
 voice-family: inherit;
 font-size: large;

} h2, h3, h4, h1 small, #rightcol h2 {

 font-size: x-small;
 voice-family: "\"}\"";
 voice-family: inherit;
 font-size: small;

} .h4 h4, li.selection ul {

 font-weight: normal;

} small, div#footer, #login, .tabs th, .tabs td, #bodycol .tabs th, #bodycol .tabs td, #navcol, input, select, .paginate, .functnbar, .functnbar2, .functnbar3, .functnbar4, #breadcrumbs, .courtesylinks, .colbar, .tasknav, #sidebar, .legend, .bars, #rightcol div.www, #rightcol div.siteinfo { /*may need to add div#footer table, #rightcol div.help */

 font-family: Verdana, Helvetica, Arial, sans-serif;
 font-size: xx-small;
 voice-family: "\"}\"";
 voice-family: inherit;
 font-size: x-small;

} .tabs td, .tabs th, dt, .tasknav .selfref, #login .username, .selection, .functnbar4 a, fieldset legend, .cumulative td, .rollupactivity td, #today {

 font-weight: bold;

} h1 em {

 font-style: normal;

}

  1. banner h2 {
 font-size: 1.25em;

} table {

 font-size: 1em;

} del {

 text-decoration: line-through;

} .tabs a {

 text-decoration: none;

} caption {

 font-size: x-small;

} caption em {

 font-weight: bold;

} /**

box properties (exclusive of borders), positioning, alignments, list types, text-indent 
    • /
  1. bodycol h1 {
 margin-top: .6em;
 margin-bottom: .5em;

} p, ul, ol, dl, table.bars {

 margin-top: .67em;
 margin-bottom: .67em;

}

  1. bodycol {
 padding-left: 12px;
 padding-right: 12px;
 padding-bottom: 12px;
 width: 100%;
 voice-family: "\"}\"";
 voice-family: inherit;
 width: auto;

} html>body #bodycol {

 width: auto;

} .h2 p, .h3 p, .h4 p, .h2 dt, .h3 dt, .h4 dt {

 margin-right: 7px;
 margin-left: 7px;

} body {

 padding: 1em;

} body.ruposite {

 margin: 0;
 padding: 0;

}

  1. login {
 float: right;
 text-align: right;
 white-space: nowrap;

}

  1. poweredby {
 margin: 0 8px 100px 0;

}

  1. collabnet {
 padding: 1px 7px;

}

  1. banner {
 padding: 8px;

} /*Headings*/ h2 {

 margin-top: 0;

} .h2 {

 margin-top: 1.67em;

} h2, h3, h4 {

 margin-bottom: 0;

}

  1. banner h2 {
 margin: 0;

} h2, h3, h4 {

 clear: both;

} .h3 h3, .h4 h4 {

 margin: 0.75em;
 padding: 0 4px;
 position: relative;
 top: -.75em;
 display: inline;
 left: 0; 

} div.h2 {

 margin: 1.5em 0 .67em;

} .h2 {

 padding-left: 0.75em;

}

  1. banner h2 {
 padding: 5px  5px 0px 10px;  

} .h3, .h4 {

 margin: 1.5em 0 .67em;
 padding: 0 0 .5em 0;

} .h2 h2 {

   padding: 3px 3px 3px .65em;
 margin-right: 2px;
 margin-left: -0.75em;
 margin-bottom: 0.75em;

} /*Widgets*/ form {

 margin: 0;

} ol ol {

 list-style-type: lower-alpha;

} ol ol ol {

 list-style-type: lower-roman;

} .tasknav {

 margin-bottom: 1.33em;

}

  1. rightcol div.www {
 padding: 0 .5em;

} div.a, div.b {

 margin: 2px 0;
 padding: 3px;

} .functnbar, .functnbar2, .functnbar3, .functnbar4 {

 padding: 5px 1em;
 margin: .67em 2px;

} .functnbar3 {

 padding: 3px 1em;
 margin-top: 0;

} .functnbar4 {

 margin: 2px 2px 0px 2px;
   white-space: nowrap;

}

  1. topmodule {
 margin: -1px -2px 0 -4px  

}

  1. topmodule td {
 vertical-align: middle;

} .right {

 text-align: right !important;

} .center {

 text-align: center !important;

} body .stb {

 margin-top: 1em;
 text-indent: 0;

} body .mtb {

 margin-top: 2em;
 text-indent: 0;

} .courtesylinks {

 margin-top: 1em;
 padding-top: 1em;

} dd {

 margin-bottom: .67em;

} .tier1 {

 margin-left: 0;

} .tier2 {

 margin-left: 1.5em;

} .tier3 {

 margin-left: 3em;

} .tier4 {

 margin-left: 4.5em;

} .tier5 {

 margin-left: 6em;

} .tier6 {

 margin-left: 7.5em;

} .tier7 {

 margin-left: 9em;

} .tier8 {

 margin-left: 10.5em;

} .tier9 {

 margin-left: 12em;

} .tier10 {

 margin-left: 13.5em;

} .filebrowse .expanded, .filebrowse .collapsed {

 padding-left: 18px;

} .filebrowse .leafnode, .filebrowse .leaf {

 padding-left: 20px;

} .filebrowse-alt .expanded, .filebrowse-alt .collapsed, .filebrowse-alt .leaf, .filebrowse-alt .leafnode, .expandedwaste, .collapsedwaste, .sortup, .sortdown {

 /* hide from macie5\*/
 float: left;
 /* resume */
 display: inline-block;
 height: 15px;
 width: 18px;
 padding-left: 0 !important;

} .filebrowse-alt .leaf, .filebrowse-alt .leafnode, .sortup, .sortdown {

 width: 20px;

} .filebrowse ul, .filebrowse-alt ul {

 list-style-type: none;
 padding-left: 0;
 margin-left: 0;

} .filebrowse ul ul, .filebrowse-alt ul ul {

 margin-left: 1.5em;
 margin-top: 0;
 padding-top: .67em;

} .filebrowse li, .filebrowse-alt li {

 margin-bottom: .67em;

} td.filebrowse h3 {

 margin-top: 0;

} .alt, .hide {

 display: none;

} fieldset {

 width: 100%;
 margin-bottom: 3px;

}

  1. breadcrumbs {
 padding: 2px 8px;

} .fieldset {

 padding: .67em;

} .colbar {

 margin: 2px;
 padding: 2px;

}

  1. footer {
 padding-left: 8px 

} .selectiongroup {

 padding-left: 1.5em;

} .inputgroup2 {

 padding-left: 3em;

} .inputgroup3 {

 white-space: nowrap;

} .removedbox {

 float: left;
 margin-right: 10px; 

} .floatright {

 float: right;

} div.strut7 {

 width: 7em;

} div.strut8 {

 width: 8em;

} div.strut13 {

 width: 13em;

} div.strut14 {

 width: 14em;

} .strut15 {

 width: 15em;

} .printbreak {/* this may need to be .app .printbreak */

 border-top: 2px #000 solid;

}

.printbreak { /* this may need to be .app .printbreak */

 margin-top: 20px;

} div.printbreak {

 page-break-after: always !important;

}

.messagechild {

 padding-left: 34px;

} .functnbar4 a {

 padding-right: 0.5em;
 padding-left: 0.5em;

}

  1. rightcol div.siteinfo h2 {
 padding: 3px;
 margin-top: .5em;

}

/*Tab sets*/

  1. toptabs {
 margin: 0;
 padding-top: .67em;
 padding-left: 8px; 

} .tabs {

 margin-top: .67em;
 margin-right: 2px;
 margin-left: 8px;
 padding-left: 8px;

} .h2 .h3 .tabs , .h2 .h4 .tabs {

 margin-left: 1.75em;

}

  1. toptabs .tabs {
 margin-left: 0px;

}

  1. toptabs .tabs th, #toptabs .tabs td, .tabs td, .tabs th {
 padding: 3px 9px;

} .tabset, .tabset .tabset {

 padding: .67em;

} /*Navigation*/ .navgroup dd li.header {

 margin-top: 4px;

} .navgroup li {

 margin-top: 7px;
 padding-left: 10px;
 list-style-type: none;

} .navgroup, .navgroup dt, .navgroup dd, .navgroup ul, .navgroup li {

 margin: 0;
 padding: 0;

} .navgroup li {

 display: block;

} .navgroup {

   margin-top: 2px;
 margin-bottom: 6px;

} .navgroup dd {

 padding: 4px 4px 4px 0;

} .navgroup dt {

 padding: 4px;

} .navgroup dl dt {

 padding: 0;

} .navgroup dd li, .navgroup dd div {

 padding-bottom: .3em;
 padding-left: 1em;

} .navgroup dd li li {

 margin-top: .3em;
 padding-bottom: 0;

}

  1. navcol, #navcol .strut {
 width: 15em;

}

  1. mytools dd, #projecttools dd, #admintools dd, #communitytools dd {
 padding-top: .33em;

}

  1. mytools, #projecttools, #admintools, #communitytools {
 padding: 0 6px 6px 6px;
 margin: -1px 0 6px -2px;

}

  1. mytools dt, #projecttools dt, #admintools dt, #communitytools dt {
 padding-left: 2px;

} .navgroup dl dt {

 padding-left: 0 !important;

} /*Tables*/ th, td {

 padding: 1px 2px 1px 2px;

} th, td {

 text-align: left;
 vertical-align: top;

} .axial th, .axial th .strut {

 text-align: right;

} .axial td th {

 text-align: left;

} .axial th, .axial th .strut {

 width: 12em;

} .legend th, .bars th {

 text-align: right;
 padding-left: 1em;

} .bars th {

 width: 12em;

} caption {

 text-align: left;

} /*Messaging*/ .errormessage, .warningmessage, .donemessage, .infomessage, .docinfo, .dirinfo {

 margin: .67em 0;
 padding: .33em 0 .67em 42px;
 min-height: 32px;

} .errormark, .warningmark, .donemark, .infomark {

 padding-left: 20px;
 min-height: 15px;

} /*Calendar*/ .calendarbody {

 margin: 17px;

} .calendarweeklabel {

 text-align: center;
 padding-bottom: 7px;

} .calendartoday, .calendarmonths {

 padding: 0 2px 0 3px;

} .periodax, .periodbx, .currentperiod, .calendarday {

 text-align: right;

} .periodax, .periodbx, .currentperiod, .othermonthday, .othermonthday a, .calendarday {

 padding-bottom: 7px;

} /*Specific to Project Dashboard*/

  1. projectperformance {
 padding: 10px;

}

.effort {

 margin-left: 50px;

} .effortbar1, .effortbar2 {

 position: absolute;

} .dashboardchart {

   padding: 5px;
 margin: 2px 2px 0px 2px;
 text-align: center;

} .statusnotstarted, .statusontrack, .statuscaution, .statusslip, .statusended {

 width: 50px;
 height: 10px;
 white-space: nowrap;

} .indenttable th .strut {

 width: 16em;

} .cumulative td, .subtotal {

 background-color: #bbb;

} .rollupactivity td {

 background-color: #ddd;

} .effortbar1 {

 background-color: #79f;

} .effortbar2 {

 background-color: #aaa;

} .dashboardchart {

 background-color: #ddd;

} table td.statusnotstarted, .statusnotstarted {

 background: #cca;

} table td.statusontrack, .statusontrack {

 background: #6c6;

} table td.statuscaution, .statuscaution {

 background: #fc6;

} table td.statusalert, .statusalert {

 background: #f30;

} table td.statusended, .statusended {

 background: #ccc;

} /*Specific to Help Docs*/ body.docs #toc li, body.docs #toc li li {

 background-image: url(strich00.gif);
 background-repeat: no-repeat;
 background-position: .5em .5em;

} body.docs div#toc {

 font-family: Verdana, Helvetica, Arial, sans-serif;
 font-size: xx-small;
 voice-family: "\"}\"";
 voice-family: inherit;
 font-size: x-small;

} body.docs div.docs {

 background-color: #fff;
 border-left: 1px solid #ddd;
 border-top: 1px solid #ddd;

} body.docs {

 background: #eee url(help_log.gif) top right no-repeat !important;

} body#legalnotices {

 background-image: none !important;

} body.docs #toc {

 position: absolute;
 top: 61px;
 left: 0px;
 width: 120px;
 padding: 0 20px 0 0;

} body.docs #toc ul, #toc ol {

 margin-left: 0;
 padding-left: 0;

} body.docs #toc li {

 margin-top: 7px;
 padding-left: 10px;
 list-style-type: none;

} body.docs div.docs {

 margin: 61px 0 0 150px;
 padding: 1em 2em 1em 1em !important;

} .docs h3, .docs h4 {

 margin-bottom: .1em;
 padding-top: .3em;

} body.docs {

 margin: 0;
 padding: 0;

} .docs {

 line-height: 1.4;

} .docs h1 {

 font-weight: bold;

} .docs h2 {

 border-bottom: 2px solid #666;
 margin: 0;
 margin-top: 1em;

} .docs h3 {

 border-bottom: 1px solid #666;
 margin: 0;
     margin-top: 1em;

} .docs h4 {

 font-weight: bold;
 margin-top: 1em;

} .doclayout th {

 background-color: #fff;

} .doclayout th {

 width: 12em;

} .docs dt {

      margin-top: 20px;

} body, ol, li, h2 { padding:0; margin: 0; }

ol#root { padding-left: 5px; margin-top: 2px; margin-bottom: 1px; list-style: none;}

  1. root ol { padding-left: 5px; margin-top: 2px; margin-bottom: 1px; list-style: none;}
  2. root li { margin-bottom: 1px; padding-left: 5px; margin-top: 2px; font-size: x-small; }

.panel { border-bottom: 1px solid #999; margin-bottom: 2px; margin-top: 2px; background: #eee; }

  1. root ul { margin-bottom: 1px; margin-top: 2px; list-style-position: inside; }
  2. root a { text-decoration: none; }

.folder { background: url(../treeimages/folder-c.gif) no-repeat; float: left; height: 14px; width: 26px; padding-right: 3px } .doc { background: url(../treeimages/file0000.gif) no-repeat; float: left; height: 14px; width: 12px; padding-right: 3px; margin-left: 20px;}

/*CollabNet branding*/

  1. banner, #toptabs {
 background-color: #663;

}

  1. banner {
 border-top: 1px solid #996;

}

  1. banner {
 padding: 1px;
 padding-left: 12px;
 padding-top: 15px;

}

.application th, .app th {

 background-color: #ddc;

} .axial th {

 background-color: #ddc;

}

  1. toptabs td, #toptabs th {
 background-image: url(../treeimages/nw_min_6.gif);

}

  1. toptabs td {
 border-bottom: 1px solid #666;
 border-right: 1px solid #333;
 border-left: 1px solid #663;

}

  1. toptabs th {
       border-left: 1px solid #663;

} .h2 h2 {

 background-color: #663;

} .h2 {

 border-left: 1px solid #663;

}

.h3 {

 border-top: 6px solid #663;

} h3 {

 color: #663;

}

  1. login, #login a {
 color: #fff;

}

  1. login a:hover {
 color: #ccf !important;

}

  1. toptabs td, .tabs th {
 background-color: #eed;

}

  1. toptabs th, .tabs td {
 background-color: #cc9;

}

  1. toptabs {
 border-bottom: 6px solid #cc9;

} .tabset {

 background-color: #eed;

}

  1. toptabs .tabs th, #toptabs th a:link, #toptabs th a:visited, .tabs th, .tabs th a:link, .tabs th a:visited {
 color: #000 !important;

} .tabs td, .tabs td a:link, .tabs td a:visited, #toptabs .tabs td, #toptabs td a:link, #toptabs td a:visited {

 color: #555 !important;

} .tabset .b td, .tabset .a td {

 background-color: #ddd;

}

  1. navcol a:link, #navcol a:visited {
 color: #000;

} a:active, a:hover, #leftcol a:active, #leftcol a:hover, #highlights a:active, #highlights a:hover {

 color: #036 !important;

}

  1. helptext dt {
 background-color: #dd9;

}

  1. highlights {
 background: #eed;
 border-right: 1px solid #999;
 border-bottom: 1px solid #999;

}

  1. highlights a:link, #highlights a:visited {
 color: black;

}

  1. highlights {
 margin: 0;
 padding: 6px;

}

  1. mainhighlights {
 margin-top: 1em
 }
  1. mainhighlights td div {
 margin: .5em
 }
  1. mainhighlights th {
 background: #dd9;
 }
  1. mainhighlights td {
 background: #ffc;
 }
  1. mainhighlights, #mainhighlights td, #mainhighlights th {
 font-size: xx-small;
 voice-family: "\"}\"";
 voice-family: inherit;
 font-size: x-small;

}

  1. mainhighlights td {
 border-right: 1px solid #cc9;
 border-bottom: 1px solid #cc9;

}

  1. mainhighlights th {
 border-right: 1px solid #996;
 border-bottom: 1px solid #996;

} .navgroup dt {

 background: #dd9;

} .navgroup {

 background: #eed;
 color: #000;

}

  1. mytools, #projecttools, #admintools, #communitytools, #mytools dt, #projecttools dt, #admintools dt, #communitytools dt {
 background-color: #dd9;
 color: #000 !important;

}

  1. searchbox dt, #helptext dt {
 color: #000 !important;

} .a td {

 background: #eee;

} .b td {

  background: #eee;

}

  1. rightcol div.siteinfo .a {
 background: #eee;

}

  1. rightcol div.siteinfo h2 {
 background-color: #663 !important;
 color: #fff !important;

}

  1. bodycol .application a:visited, #bodycol .app a:visited #bodycol .tasknav a:visited {
 color: purple !important;

} .readyset h3, .readyset h4 {

 padding: 3px;
 padding-left: 5px;
 margin-right: 2px;
 margin-left: 2px;
 margin-bottom: 0;
 clear: both;

}

.readyset .axial th {

 text-align: right;
 white-space: nowrap;

} dd {

 margin-bottom: .67em; 

} .tier1 { margin-left: 0; } .tier2 { margin-left: 1.5em; } .tier3 { margin-left: 3em; } .tier4 { margin-left: 4.5em; } .level1 { padding-left: 0; } .level2 { padding-left: 1em; } .level3 { padding-left: 2em; } .level4 { padding-left: 3em; }

/* additions specific to ReadySET */ tr ul, tr ol, tr p {

 margin-top: 0; 

} tr ul {

 margin-left: 0px; padding-left: 2em; 

}

.sticky {

 padding: 3px;
 margin-right: 2px;
 margin-bottom: 3px;
 border-right: 1px solid;
 border-bottom: 1px solid;

} .tip {

 padding: 3px;
 margin-right: 2px;
 margin-bottom: 3px;
 border-right: 1px solid;
 border-bottom: 1px solid;

} .todo {

 padding: 3px;
 margin-right: 2px;
 margin-bottom: 3px;
 border-right: 1px solid;
 border-bottom: 1px solid;

}

  1. processimpact {
 border: 1px solid;
 padding: 3px;
 margin-right: 2px;
 margin-bottom: 2px;

} .footnote {

 width: 80%;
 border-top: solid #aaa 1px;
 font-size: x-small;
 padding-top: 3px;
 margin-top: 3em;

} .reusablefragment {

 padding: 6px;
 margin-top: 3em;
 margin-bottom: 3em;

} .sample1, .sample2, .sample3, .sample4 {

 padding-right: 2px;
 margin-bottom: 4px;

} .legal1 {

 border: 2px solid;
 padding: 3px;
 text-align: center !important;
 font-size: xx-large;
 font-weight: bold;
 display: none;

} .linklist a {

 display: block; 

} .sub {

 padding-left: 1em;  

}

target {
 border: 2px solid red; 

} .footnote {

 /* To hide footnotes, change "block" to "none". */
  display: block;

}

.sticky {

 background: #ffc;
 border-right-color: #aaa;
 border-bottom-color: #aaa;

} .tip {

 background: #ffc;
 background-image: "url(../treeimages/tip00000.gif)";
 background-repeat: no-repeat;
 background-position: top left;
 border-right-color: #aaa;
 border-bottom-color: #aaa;
 padding-left: 36px;
 min-width: 30px; min-height: 30px;
/* filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="tip.png",sizingMethod="scale"); */

}

.todo {

 background: #ffc;
 background-image: "url(../treeimages/todo0000.gif)";
 background-repeat: no-repeat;
 background-position: top left;
 border-right-color: #aaa;
 border-bottom-color: #aaa;
 padding-left: 36px;
  min-width: 30px; min-height: 30px;
/* filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,src="todo.png",sizingMethod=scale); */

}

  1. processimpact {
 background: #eee;
 border-color: #aaa;
 background-image: "url(../treeimages/gears000.gif)";
 background-repeat: no-repeat;
 background-position: top left;
 padding-left: 36px;
 min-width: 30px; min-height: 30px;
/* filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="gears.png",sizingMethod="scale"); */

} .reusablefragment {

 background: #eee;
 border: 2px dashed;

} .sample1 { border-right: 4px double #500; } .sample2 { border-right: 4px double #050; } .sample3 { border-right: 4px double #005; } .sample4 { border-right: 4px double #505; } a.def {

 text-decoration: none; 
 border-bottom: dashed 1px blue;
 cursor: help;

} .legal1 { /* display: block !important; */

 background: #eee;
 border-color: #aaa;

}

  1. navcol div.body {
 background-image: none;

}

  1. navcol div.body {
 padding-bottom: .3em;
 padding-left: 0px;
 padding-right: 0px;
 margin-right: 0;

}

  1. navcol div.body div {
 margin-top: .3em;
 padding-bottom: 0;

} .navgroup .body {

 border-top: 1px solid #aaa;

} .navgroup .body {

 padding: 0px;
 margin: 0em;

} .navgroup .label {

 padding: 4px;

}

/* EyeBrowse message reader */ .tabset pre {

background-color: #fff;
border: 1px solid #ccc;
padding-left: 4px;
padding-top: 4px;

} </style>

<script language=javascript> function toggle(elm) { var newDisplay = "none";

elm.style.backgroundImage = "url(treeimages/folder-c.gif)";
var e = elm.nextSibling; 
while (e != null) {
 if (e.tagName == "OL" || e.tagName == "ol") {
  if (e.style.display == "none") {
   newDisplay = "block";
   elm.style.backgroundImage = "url(treeimages/folder-c.gif)";
  }
  break;
 }
 e = e.nextSibling;
}
while (e != null) {
 if (e.tagName == "OL" || e.tagName == "ol") e.style.display = newDisplay;
 e = e.nextSibling;
}

} function collapseAll(tags) {

for (i = 0; i < tags.length; i++) {
 var lists = document.getElementsByTagName(tags[i]);
 for (var j = 0; j < lists.length; j++) 
  lists[j].style.display = "none";
  var e = document.getElementById("root");
  e.style.display = "block";
}

} function openBookMark() {

var h = location.hash;
if (h == "") h = "default";
if (h == "#") h = "default";
var ids = h.split(/[#.]/);
for (i = 0; i < ids.length; i++) {
 if (ids[i] != "") toggle(document.getElementById(ids[i]));
}

} </script> <script language=javascript> var current=new Array(); var ready=new Array(); var num=1; function out(obj) { var str=""; for(i in obj)str=str +i + " "; return str; } function getid(str) { s=str.slice(0,str.length-3); return s; } function del(obj) { while(obj.hasChildNodes())

   {
   del(obj.childNodes[0]);
   }

obj.parentNode.removeChild(obj); } function getlen(obj) { j=0; for(k in obj)

   {
   j=j+1;
   }

return j; }

function obj_more(e) { var s=(e.target)?e.target:e.srcElement; id=getid(s.id); s=document.getElementById(id); sa=document.getElementById(id+"an1"); if(ready[s.id]==false)

   {
   addbranch(s,current[s.id],false,false);
   ready[s.id]=true;
   }
   else 
   {
   toggle(sa);
   }

}


function init(parent,obj,isid,parid) { if(parent==null)parent=document.body; if(isid)obj=document.getElementById(obj); if(parid)parent=document.getElementById(parent); div0=document.createElement("div"); div0.style.border="dashed 1px #000"; div0.style.padding="3px"; div0.style.margin=" 3px"; ol0=document.createElement("ol"); ol0.id="rootol"; li0=document.createElement("li"); li0.id="root"; ol0.appendChild(li0); div0.appendChild(ol0); parent.appendChild(div0); addbranch("root",obj,true,false) }


function addbranch(parent,obj,parent_isid,isid) { if(isid)obj=document.getElementById(obj); if(parent_isid)parent=document.getElementById(parent);

ol0=document.createElement("ol"); ol0.style.border="thin solid"; for(i in obj)

   {
   li1=document.createElement("li");
   a1=document.createElement("a");
   a1.className="doc";
   proptext=document.createTextNode(i);
   try 
 {
 proptext1=document.createTextNode(obj[i]);
 }
 catch(ex0)
 {
 proptext1=document.createTextNode("error");
 }
   li1.appendChild(a1);
   a2=document.createElement("a");
   table1=document.createElement("table");
   tr1=document.createElement("tr");
   
   td2=document.createElement("td");
   td2.appendChild(proptext);
   td2.style.border="thin solid";
   td3=document.createElement("td");
   td3.appendChild(proptext1);
   td3.style.border="thin solid";
   
   try
 {
 if (getlen(obj[i])>0)
     {
     a1.className="folder";
     li1.id=num;
     ol0.id=num+"ol";
     try
   {
   current[num]=obj[i];
   ready[num]=false;
   td3.id=num+"td3";
   td2.id=num+"td2";
   a1.id=num+"an1";
   num=num+1;
   }
   catch(ex1)
   {
   };
     var success=(a2.addEventListener)?a2.addEventListener("click",obj_more,false):a2.attachEvent("onclick",obj_more);
         
 
     }
 }
 catch(ex2)
 {
 alert(ex2);
 }
   
   
   tr1.appendChild(td2);
   tr1.appendChild(td3);
   table1.appendChild(tr1);
   a2.appendChild(table1);
   li1.appendChild(a2);
   
   ol0.appendChild(li1);
   }

parent.appendChild(ol0); } </script> <script type="text/javascript"> </script>

   <title>Javascript Tree</title>
   <link href="mainstyle.css" rel="stylesheet" type="text/css"> 

<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1"> </head> <body onLoad="init(null,window,false,false);">

BETA2

<script> </script> </body> </html>


      </source>
   
  

<A href="http://www.wbex.ru/Code/JavaScriptDownload/jstree.zip">jstree.zip( 18 k)</a>