Is html5 drag and drop broken on safari browser fo

Question

Is html5 drag and drop broken on safari browser for windows ? If so, are there any work arounds ?

I'm using Safari 5.1.2 on Windows 7 and the drop targets always show up as non droppable. Tried this on 2 different windows 7 computers with clean install and latest setup.

Tried with both this demo and my own code which works on every other latest browser.

http://html5demos.com/drag

Answer 1

Yes. After a lot of self-doubt, experimentation, and research, I can say that it is definitely broken for me too (Safari 5.1.7 on Windows) as at today: 15 Nov 2012. This has been quite confusing and distressing!

Hope Apple comes to the party soon.

Answer 2

From http://html5doctor.com/native-drag-and-drop/#dragging_anything
add this:

[draggable=true] {
  -khtml-user-drag: element;
}

Non-HTML5 drag and drop is available via jQuery UI: http://jqueryui.com/demos/draggable/

You can build a download with only that specific function if you want it to be lightweight.

You can use Modernizr to detect whether it's supported and fall back on jQuery if needbe:

if (Modernizr.draganddrop) {
  // Browser supports HTML5 DnD.
} else {
  // Fallback to a library solution.
}

From http://www.html5rocks.com/en/tutorials/dnd/basics/

Answer 3

Indeed D&D for Safari doesn't work.

Kind of work around for Safari:

Put the logic in the 'dragend' event of the draggable object
Instead in the 'drop' event of the dropping on object.