Drag and drop is a widely used feature where you grab an object and move it to another location on the screen.
The numbers in the table indicate the earliest browser version that fully supports Drag and Drop.
Here’s a straightforward example of drag and drop:
| <!DOCTYPE HTML> <html> <head> <script> function allowDrop(ev) { ev.preventDefault(); } function drag(ev) { function drop(ev) { </head> <body> <div id=”div1″ ondrop=”drop(event)” ondragover=”allowDrop(event)”></div> <img id=”drag1″ src=”img_logo.gif” draggable=”true” ondragstart=”drag(event)” width=”336″ height=”69″> </body> </html> |
While it might appear complex, let’s break down the various components of a drag and drop event.