[whatwg] Proposed addition to Drag and Drop API

Ian Hickson ian at hixie.ch
Thu Aug 30 10:59:28 PDT 2012

On Fri, 29 Jun 2012, Alex Bain wrote:
> I've spent the past few days working with the Drag and Drop API and I'd 
> like to propose an addition to the spec to aid developers and designers 
> in creating accessible drag interfaces.
> **Use case:**
> I'm developing an app that allows users to drag pieces of user generated 
> content (Posts) from one part of the app to another. A Post is 
> represented as a DOM subtree with multiple components - a title, some 
> images, text, and so forth. I wanted to create an interaction where the 
> user could click and drag anywhere on the Post (large click target for 
> accessibility purposes), see a subset of the Post as a drag indicator 
> (the title, for example), and then be able to drop that elsewhere in the 
> app.
> **Existing solutions:**
> 1) I can define a custom drag image that is shown during drag.
> 2) I can define a custom canvas element that is shown during drag.
> 1) In this situation a custom drag image would not solve the problem. I would not be able to predefine images for all possible post titles. I could represent all drag actions with a single image but I believe that providing something contextually relevant (an actual component of the post) would be of benefit to users.
> 2) The custom canvas element could solve this problem but feels unwieldy.
> **Proposed solution:**
> In the scenario above I would prefer to define a custom drag element, 
> set the innerHTML to a component of the Post (title), and then style the 
> element itself in CSS.

That's what the addElement() method is intended to do.

Ian Hickson               U+1047E                )\._.,--....,'``.    fL
http://ln.hixie.ch/       U+263A                /,   _.. \   _\  ;`._ ,.
Things that are impossible just take longer.   `._.-(,_..'--(,_..'`-.;.'

More information about the whatwg mailing list