How can I create a Javascript / JQuery algorithmic function that will be evaluated at loading and re-drawn during mousedrag?

Question

I started development in a web application, and now I am dealing with some of the first obstacles at the forefront. First, I will give you some information about the interface to make sure the context of my question is clear.

** Below is a chart showing the various items related to the question. *

Everyone is being Nodedragged. If you want, please quickly browse http://labs.inversepenguin.com to view the test canvaswith active Node.

Diagram notes:

Node 2 2 1, link. , link, node2 ... , node2.

---

" Javascript/JQuery, mousedrag?"

---

:

• nodes, , links .

• / links .

• link; .

, , "" " " mousedrag.

---

, , , , , if, " ", .

!

Answer 1

JQuery UI , start, drag stop, .

$( ".selector" ).bind( "dragstart", function(event, ui) {
  ...
});

$( ".selector" ).bind( "drag", function(event, ui) {
  ...
});

$( ".selector" ).bind( "dragstop", function(event, ui) {
  ...
});

, node , . , . 2 node :

<div id="node1" child="node2" />
<div id="node2" parent="node1" />

, , -

<div id="node1" children="node2;node3;node4" />

. , var children = $(this).attr('children').split(';');, . , .

Answer 2

jQuery, jQuery UI. , drag -event. , , "".

, , "".