HTML5 Drag and Drop for precise placement

Question

All,

We are looking to use HTML5 Drag 'n drop in our web-application, however, we need precise drop of items, not just a drop in the broad basket. As an example, we will create an icon and the user has to precisely place the icon in the canvas (or SVG) frame. In the background we will record the X Y co-ordinates where the item was placed.

Ajaxian has a wonderful article on HTML5 drag and drop, however, we are not sure how to implement our precise movement requirement. As per the Ajaxian article, we actually want the (what they refer to as) 'old school implementation' (first example in the link below):

http://decafbad.com/2009/07/drag-and-drop/api-demos.html#delegated

Suggestions?

Best,