Inside Technique : Adding Drag and Drop
Using Internet Explorer 4.0 with Dynamic HTML and CSS-Positioning, you can add greater interactivity to your web-page. This short article provides
a framework for quickly and easily adding drag-drop code to your web page. This builds upon the code from the Killer Drag
DropIE4 technique. In this article, we build a framework that:
- Enables any absolute positioned element to be dragged
- Allows any element to be specified as a drop target
- Adds custom events to the drag source and the drop target
Before you begin, please review the following terminology:
- This refers to the W3C CSS-Positioning Working Draft that is fully supported in Internet Explorer 4.
This draft allows you define the absolute position on the element in the page.
- Drag Source
- This is the element that is being dragged by the user.
- Drop Target
- This is the target element when the user completes a drag operation. The dragged element must be fully contained within the drop target for the drop target to accept the operation.
On the next page is a demonstration of the framework.
© 1997-2000 InsideDHTML.com, LLC. All rights reserved.