tree.css.orig

这是YUI的源码及相关示例。里面有很多很炫的Javascript效果。

/* Copyright (c) 2006 Yahoo! Inc. All rights reserved. */

/* first or middle sibling, no children */
.ygtvtn {
	width:16px; height:22px; 
	background: url(../../img/default/tn.gif) 0 0 no-repeat; 
}

/* first or middle sibling, collapsable */
.ygtvtm {
	width:16px; height:22px; 
	cursor:pointer ;
	background: url(../../img/default/tm.gif) 0 0 no-repeat; 
}

/* first or middle sibling, collapsable, hover */
.ygtvtmh {
	width:16px; height:22px; 
	cursor:pointer ;
	background: url(../../img/default/tmh.gif) 0 0 no-repeat; 
}

/* first or middle sibling, expandable */
.ygtvtp {
	width:16px; height:22px; 
	cursor:pointer ;
	background: url(../../img/default/tp.gif) 0 0 no-repeat; 
}

/* first or middle sibling, expandable, hover */
.ygtvtph {
	width:16px; height:22px; 
	cursor:pointer ;
	background: url(../../img/default/tph.gif) 0 0 no-repeat; 
}

/* last sibling, no children */
.ygtvln {
	width:16px; height:22px; 
	background: url(../../img/default/ln.gif) 0 0 no-repeat; 
}

/* Last sibling, collapsable */
.ygtvlm {
	width:16px; height:22px; 
	cursor:pointer ;
	background: url(../../img/default/lm.gif) 0 0 no-repeat; 
}

/* Last sibling, collapsable, hover */
.ygtvlmh {
	width:16px; height:22px; 
	cursor:pointer ;
	background: url(../../img/default/lmh.gif) 0 0 no-repeat; 
}

/* Last sibling, expandable */
.ygtvlp { 
	width:16px; height:22px; 
	cursor:pointer ;
	background: url(../../img/default/lp.gif) 0 0 no-repeat; 
}

/* Last sibling, expandable, hover */
.ygtvlph { 
	width:16px; height:22px; cursor:pointer ;
	background: url(../../img/default/lph.gif) 0 0 no-repeat; 
}

/* Loading icon */
.ygtvloading { 
	width:16px; height:22px; 
	background: url(../../img/default/loading.gif) 0 0 no-repeat; 
}

/* the style for the empty cells that are used for rendering the depth 
 * of the node */
.ygtvdepthcell { 
	width:16px; height:22px; 
	background: url(../../img/default/vline.gif) 0 0 no-repeat; 
}

.ygtvblankdepthcell { width:16px; height:22px; }

/* the style of the div around each node */
.ygtvitem { }  

/* the style of the div around each node's collection of children */
.ygtvchildren { }  
* html .ygtvchildren { height:2%; }  

/* the style of the text label in ygTextNode */
.ygtvlabel, .ygtvlabel:link, .ygtvlabel:visited, .ygtvlabel:hover { 
	margin-left:2px;
	text-decoration: none;
}

.ygtvspacer { height: 10px; width: 10px; margin: 2px; }