1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
\r
5 <meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
8 <script src="LoadRicoClient.js" type="text/javascript"></script>
\r
10 <script type='text/javascript'>
\r
11 Rico.loadModule('Corner','DragAndDrop');
12 Rico.onLoad( function() {
\r
13 Rico.Corner.round('explanation');
\r
14 // first parameter to Rico.Draggable can be anything, second parameter is the element to be dragged
\r
15 Rico.registerDraggable( new Rico.Draggable('test-type','dragme') );
\r
16 Rico.registerDropZone( new Rico.Dropzone('droponme') );
\r
17 Rico.registerDropZone( new Rico.Dropzone('droponme2') );
\r
21 <link href="../demo.css" type="text/css" rel="stylesheet">
\r
22 <style type="text/css">
\r
24 font-family : Arial;
\r
26 background-color : #797979;
\r
32 font-family : Arial;
\r
36 text-align : center;
\r
37 border-bottom : 1px solid #6b6b6b;
\r
38 border-right : 1px solid #6b6b6b;
\r
45 border : 1px solid #5b5b5b;
\r
49 font-family : Arial;
\r
52 background-color : #cdd7b5;
\r
55 div.simpleDropPanel {
\r
59 border : 1px solid #5b5b5b;
\r
67 <h1>Rico Simple Drag & Drop Example</h1>
69 <p id='libname'>Base Library:
\r
70 <script type='text/javascript'>
\r
71 document.write(Rico.Lib+' '+Rico.LibVersion);
\r
75 <div style="padding:5px;border:1px solid #5b5b5b;height:50px;clear:both;">
\r
77 <div class="box" style="background:#f7a673" id="dragme">Drag Me</div>
\r
80 <p><table style="margin-bottom:8px" cellspacing="3" cellpadding="3">
\r
83 <div id="droponme" class="simpleDropPanel" style="background:#ffd773">
\r
84 <div class="title">Drop On Me</div>
\r
90 <div id="droponme2" class="simpleDropPanel" style="background:#c6c3de">
\r
91 <div class="title">Drop On Me 2</div>
\r
97 <div id="explanation" class="explanation">
\r
99 <div class="box" style="background:#f7a673" id="dragme">
\r
103 <div id="droponme" class="simpleDropPanel" style="background:#ffd773">
\r
104 <div class="title">Drop On Me</div>
\r
107 <div id="droponme2" class="simpleDropPanel" style="background:#c6c3de">
\r
108 <div class="title">Drop On Me 2</div>
\r
112 // first parameter to Rico.Draggable can be anything
\r
113 // second parameter is the element to be dragged
\r
114 Rico.registerDraggable( new Rico.Draggable('test-type','dragme') );
\r
115 Rico.registerDropZone( new Rico.Dropzone('droponme') );
\r
116 Rico.registerDropZone( new Rico.Dropzone('droponme2') );
\r
117 </script></pre>
\r