Html5 drag and drop, html5 drag and drop

Html5 drag and drop, html5 drag and drop
Browser support

Internet Explorer 9 +, Firefox, Opera 12, Chrome, and Safari 5 support drag and drop.

Note: Drag and Drop is not supported in Safari 5.1.2.

HTML5 drag-and-drop instances

The following example shows a simple drag-and-drop instance:

Instance

<! Doctype html> Step 1: Set the elements to be dragged:

Step 2: Set the drag object
Function drag (ev) {ev. dataTransfer. setData ("Text", ev.tar get. id )};
;
Step 3: place elements
Function drop (ev ){
Ev. preventDefault (); // prevents default Processing
Var data = ev. dataTransfer. getData ("Text"); // obtain the value of the dragged object.
Ev.target.appendchild(registry.doc ument. getElementById (data); // Add the value to the target object
};