Drag and drop using HTML5

Question

I am working on HTML5 & I am a newbie in it.

I am working on a program which does the following :

1. I want to drag & drop files on a button.
2. User will be able to see all drag dropped files.
3. There needs to be a button to upload files.
4. After uploading, a progress bar should pop up on which there will be cancel upload & skip (if dont want to upload specific file) button.

Kindly let me know how can I do the same.
Thanks in advance.

Answer 1

如果您知道一些jQuery，则可以使用jQuery UI droppable / dragable： http : //jqueryui.com/demos/droppable/

Answer 2

Here are pretty simple examples for everything you asked : files from input tag, files from drag&drop, printing files names and showing a progress bar. I enjoy that website that makes it easy with the 'new' html5 features.