Hello,

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.


Thoughts?

- Alex

Reply via email to