Explorer-style Tree

With CodeThatTree you can create an explorer-style tree like this:

To get an explorer-like tree the following style parameters should be set:

imgline           : string   : url of the image for a line
imgitem           : string   : url of the image for a tree leaf
imgitem_l         : string   : url of the image for the last tree
                               leaf on its level (L - like image)
imgdir            : string   : url of the image for a tree node
imgdiropen        : string   : url of the image for an open tree node
imgdir_l          : string   : url of the image for the last tree node
                               on its level (L - like image)
imgdiropen_l      : string   : url of the image for the open last tree
                               node on its level (L - like image)
lined             : boolean  : should be true to draw an explorer - like tree

For example:

"style" : {
	"imgline" : "img/line.gif",
	"imgitem" : "img/t-item.gif",
	"imgitem_l" : "img/l-item.gif",
	"imgdir" : "img/t-folder.gif",
	"imgdiropen" : "img/t-folder-open.gif",
	"imgdir_l" : "img/l-folder.gif",
	"imgdiropen_l" : "img/l-folder-open.gif"
	"lined" : true
}

Example - Explorer-Style Tree

You can see an example and complete code here - Explorer-Style Tree Example [popup]

Tree with wrapping ^new

With CodeThatTree you can create an lined tree with wrapped text

Note. We advice you use wrapping only in simple nodes not folders.

"style" : {
	"wrap" : true
}

Example - Lined Tree With Wrapping

You can see an example and complete code here - Lined Tree With Wrapping Example [popup]

Generally, the property wrap can be used with any tree, not only lined. By default, this property is false.

Read more about CodeThatTree >>

© CodeThat.com, 2003-2008
Design by XTLabs, Inc.