Shulou(Shulou.com)06/01 Report--

In this article, the editor introduces in detail the "HTML5 drag-and-drop case analysis", with detailed content, clear steps and proper handling of details. I hope this "HTML5 drag-and-drop case analysis" article can help you solve your doubts.

HTML5 drag and drop (Drag and Drop)

Drag and drop (Drag and drop) is part of the HTML5 standard.

Drag the RUNOOB.COM icon into the rectangle.

Drag and drop is a common feature that grabs an object and then drags it to another location.

In HTML5, drag and drop is part of the standard, and any element can be dragged and dropped.

Browser support

InternetExplorer9+,Firefox,Opera,Chrome, and Safari support dragging.

Note: Safari5.1.2 does not support dragging.

HTML5 drag and drop instance

The following example is a simple drag and drop example:

Example

Rookie course (runoob.com)

# div1 {width:350px;height:70px;padding:10px;border:1px solid # aaaaaa;}

Function allowDrop (ev)

{

Ev.preventDefault ()

}

Function drag (ev)

{

Ev.dataTransfer.setData ("Text", ev.target.id)

}

Function drop (ev)

{

Ev.preventDefault ()

Var data=ev.dataTransfer.getData ("Text")

Ev.target.appendChild (document.getElementById (data))

}

Drag the RUNOOB.COM picture to the rectangle:

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.