This simple component let you add a drag and drop mechanism to your page, with minimal coding from you. Note that this component is not meant to be extensive, and should be seen as a starting point.

View Example( Requires Netscape Communicator)
 

USING THE COMPONENT

<script language=javascript1.2 src=/old?u=http%3A%2F%2Fdeveloper.iplanet.com%2Fdocs%2Fexamples%2Fdynhtml%2Fdragable%2Fdragable.js&y=1999></script>

<script language=javascript1.2 >
  var d= new Dragable( 100, 100, "<h1>Drag me</h1>");
</script>

The constructor accepts two possible syntax:

• new Dragable(x, y, html)

This creates a layer containing 'html', at the position (x,y), and makes this layer dragable.
• new Dragable(layer)

This takes an existing layer, and makes it dragable.

In both cases, an object is returned. This object has the following members:

• layer: Layer object. read-only. points to the dragable layer.
• onmove: event handler. This handler is called each time the pointer is moved over the layer.
• ondown: event handler. This handler is called when the user starts clicking on the layer.
• ondrag: event handler. This handler is called each time the layer is dragged.
• ondrop: event handler. This handler is called when the layer is dropped.

These four handlers are called with the Dragable object as argument.

SOURCE

    The source of the component can be found here.
 

---

Related Readings:

• Frequently Asked Questions: Find the answers to your questions on Internet technologies.
• Documentation: A library of technical information.
• Developer Central: Collections of developer resources organized by Internet technology areas.

Any sample code included above is provided for your use on an "AS IS" basis, under the Netscape License Agreement - Terms of Use