HTML and CSS Reference
In-Depth Information
The result is a nice little bespoke drag icon that better represents
the data you're moving around (
Figure 8.4
). To keep things con-
sistent with the madness that is the Drag and Drop specification,
the coordinate system for the drag image is the inverse of what
you'd expect. Since all (or all that I can think of) web technology
coordinate systems work with the centre point being the top left,
you might think that setting a negative offset would put the drag
image -10 up and -10 left. No, in fact you'd be wrong, obviously...
it actually puts the image 10 below and 10 to the right. Really the
rule of thumb with Drag and Drop is: all bets are of.
FIguRE 8.4
We've created
a custom Twitter cursor
when dragging Twitter-related
data around.
If you've made it this far undeterred by the warnings and dead
bodies throughout this specification, then hopefully the appli-
cation with drag and drop that you're implementing will come
under the question of accessibility. Is the drag and drop API
accessible, or can I make it accessible?
Well, as you'd expect with this specification, there's a good
intention. So yes, the API has been designed with accessibility
in mind. It's not terribly clear, but the latest thinking is that the
user should be able to control dragging and dropping using the
keyboard copy and paste model.
The process is supposed to be: Navigate to the element you want
to drag, copy to the clipboard using the keyboard shortcuts, and
then navigate to the drop zone, and paste using the keyboard.
