My favorites | Sign in
Project Home Downloads
READ-ONLY: This project has been archived. For more information see this post.
Search
for
  Advanced search   Search tips   Subscriptions

Issue 321 attachment: _test-ISSUE3.html (3.6 KB)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"/>
<title>Dynatree - Example</title>

<script src="../jquery/jquery.js" type="text/javascript"></script>
<script src="../jquery/jquery-ui-1.8.20.custom.min.js" type="text/javascript"></script>
<link href="../jquery/cupertino/jquery-ui-1.8.20.custom.css" rel="stylesheet" type="text/css">
<script src="../jquery/jquery.cookie.js" type="text/javascript"></script>

<link href="../src/skin/ui.dynatree.css" rel="stylesheet" type="text/css">
<script src="../src/jquery.dynatree.js" type="text/javascript"></script>

<style type="text/css">
#firstDiv {width:250px; float: left;}
#outer {width:550px; float: left;}
#tree {width:350px; float: left;}
</style>
</head>
<script type="text/javascript">
var gv_newRosterOptionID = -1;
$(document).ready(function() {
$("#tabs").tabs();

$(function () {
$("#tree").dynatree({
debugLevel:2,
onActivate: function (node) {
$("#active").text(node.data.title);
},
onFocus: function (node) {
$("#focus").text(node.data.title);
},
dnd: {
preventVoidMoves: true,
onDragStart: function (node) {
//logMsg("tree.onDragStart(%o)", node);
return true;
},
onDrop: function (node, sourceNode, hitMode, ui, draggable) {
//logMsg("tree.onDrop(%o, %o, %s)", node, sourceNode, hitMode);
sourceNode.move(node, hitMode);
},
onDragEnter: function (node, sourceNode) {
return true; //["before", "after"];
}
}
});
});
});
</script>
<body>
<!-- Add a <div> element where the tree should appear: -->
<div id="firstDiv">
The First Div - push it left
</div>
<div id="outer">
<P> This is some other text - Push it down
<div id="tabs">
<ul>
<li><a href="#fragment-1"><span>One</span></a></li>
<li><a href="#fragment-2"><span>Two</span></a></li>
<li><a href="#fragment-3"><span>Three</span></a></li>
</ul>
<div id="fragment-1">
<div id="tree">
<ul>
<li id="key1" title="Look, a tool tip!">item1 with key and tooltip
<li id="key2" class="selected">item2: selected on init
<li id="key3" class="folder">Folder with some children
<ul>
<li id="key3.1">Sub-item 3.1
<li id="key3.2">Sub-item 3.2
</ul>

<li id="key4" class="expanded">Document with some children (expanded on init)
<ul>
<li id="key4.1">Sub-item 4.1
<li id="key4.2">Sub-item 4.2
</ul>
</ul>
</div>
</div>
<div id="fragment-2">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
</div>
<div id="fragment-3">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
</div>
</div>
</div>
</body>
</html>




Powered by Google Project Hosting