The drag-n-drop tags combine with javascript functions to simplify the coding of both drag sources and drag targets.

Not that this is NOT what is often referred to as drag-n-drop by the majority of DHTML articles which tend to be concerned simply with the re-positioning of an element.

A dragSource has an onMouseDown handler specified that will initiate the drag.

All dragTargets are registered as such when the document loads.

A dragSource is provided with a type attribute, and a a match attribute.

The drag is deemed to have commenced when the mouse is first moved a small number of pixels (trial and error has confirmed that 5 pixels seems to work well) - if it is released within these initial constraints then any default onClick behaviour is processed as normal.

When the drag commences a special DIV element is made visible and follows any mouse movement. This provides the visual feedback which otherwise would be confused by standard browser responses.

The special DIV unfortunately prevents standard event interception from determining the target of the drag. This is why the targets must be registered, so that their location can be tested as the mouse is moved.

If the mouse moves into a registered dropTarget the drag type is checked against the drop match. If all is okay, then the graphic in the drag DIV is updated to indicate this.

When the mouse is released the current target is checked again to determine the dropAction attribute. This value is a javascript function that is evaluated with the IDs of both the dragSource and dragTarget elements.

It should be clear that the protocol is fairly complex and would be problematical without the idiomatic support provided by the custom tags.