Sign Up to our social questions and Answers Engine to ask questions, answer people’s questions, and connect with other people.
Login to our social questions & Answers Engine to ask questions answer people’s questions & connect with other people.
Lost your password? Please enter your email address. You will receive a link and will create a new password via email.
Please briefly explain why you feel this question should be reported.
Please briefly explain why you feel this answer should be reported.
Please briefly explain why you feel this user should be reported.
I have found loads of jQuery plugins to allow a user to drag and drop a file onto a “dropzone” and add the file to an upload queue or immediately upload it.
However, I would like to allow my users to drag an image onto a dropzone and have that populate an <input type="file">.
Does this exist already? If not, how would I go about creating it?
Many thanks,
Andy
HTML5 drag and drop file field
Here is what ended up working, I set the vanilla upload field to opacity : 0 and positioned it under the mouse when the mouse is over the visible dropZone div, via the ‘dragover’ event.
‘dragover’ overcomes the problem with the browser window being out of focus, and provides .pageX and .pageY which I then bound to the invisible file field’s .top and .left.