Drag and Drop API
Using the Drag and Drop API


Step 1: Load the API.

Place the following code in your page's HEAD tag. The src= value is the relative location of the .js file on your web server. <script type="text/javascript" src="dragdrop.1.0.1.js"></script>

Step 2: Setup up the appropriate ID's and onmousedown javascript calls.

There are 2 parts to any draggable layer. The first part is the container and the second part is the drag object. When the drag object is clicked on and moved it will move all the data in the container.
<div id="container"> <div id="drag_object" onmousedown="dd_start('container');"> USE ME TO DRAG </div> I'm draggable! Is draggable even a word? </div>

Click on the link below to see an example.

Show me an example


An example HTML Document:
<html> <head> <title>Drag & Drop Demo</title> <script type="text/javascript" src="dragdrop.1.0.1.js" /> </head> <body> <div id="container"> <div id="container_header" onmousedown="dd_start('container');"> USE ME TO DRAG </div> I'm draggable! Is draggable even a word? </div> </body> </html>

Network

Products & Services
BSG Online Games | Copyright © - 2008 | Privacy Policy