Specific top offset

There is a functionality in the tree which allows you to adjust the distance between the selected node and its superior one. To achieve this you should select an item in the tree, set the size of distance in boxe and then click on the action link.

Set top offset of selected item

Specific top offset can be set from xml - "topoffset" atribute or by the myTree.setItemTopOffset method.

</> Source

<!DOCTYPE html>
<!--pro-->
<html>
<head>
	<title>Specific top offset</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
	<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
	<link rel="stylesheet" type="text/css" href="../../../codebase/fonts/font_roboto/roboto.css"/>
	<link rel="stylesheet" type="text/css" href="../../../codebase/dhtmlx.css"/>
	<script src="../../../codebase/dhtmlx.js"></script>
	<link rel="stylesheet" type="text/css" href="../common/demo_style.css"/>
	<script>
		var myTree;
		function doOnLoad(){
			myTree = new dhtmlXTreeObject("treeboxbox_tree","100%","100%",0);
			myTree.setImagePath("../../../skins/web/imgs/dhxtree_web/");
			myTree.enableSmartXMLParsing(true);
			myTree.enableCheckBoxes(true);
			myTree.enableDragAndDrop(true);
			myTree.enableThreeStateCheckboxes(true);
			myTree.load("../common/tree_to.xml")
		}
	</script>
</head>
<body onload="doOnLoad();">
	<h1>Specific top offset</h1>
	<p>There is a functionality in the tree which allows you to adjust the distance between the selected node and its superior one. To achieve this you should select an item in the tree, set the size of distance in boxe and then click on the action link.</p>
	<table>
		<tr>
			<td>
				<div id="treeboxbox_tree" class="tree_demo_samples" style="height:320px"></div>
			</td>
			<td rowspan="2" style="padding-left:25px" valign="top">
				<a href="#" onClick="myTree.setItemTopOffset(myTree.getSelectedItemId(),this.nextSibling.value);">Set top offset of selected item</a><input value='20px'><br>
			</td>
		</tr>
	</table>
	Specific top offset can be set from xml - "topoffset" atribute or by the myTree.setItemTopOffset method.
</body>
</html>

Documentation

Check documentation to learn how to use the components and easily implement them in your applications.