With the rapid development new web technologies, drag-and-drop file uploading seems to be the new norm. No more clicking “Upload” and having to navigate through a maze of folders. Just drag the file from an open window on your computer and voila, ready for upload.

Unfortunately, some older sites don’t have this feature. Most modern browsers, however, do have this. That means you can make drag-and-drop file upload work on virtually any site.

When you see a “Choose Files”, “Upload”, “Select files”, or similar button on a website…

upload-button-example

simply take a file on your computer, and drag it right over the button.

copy-drag-and-drop

Release your mouse button, and there you go. Files = ready for upload.

For sites that support multiple file upload, this approach works equally well by selecting multiple files (Shift, Control + Click).

I have tested this in Firefox, Chrome, and Opera, all of which support native drag-and-drop. Sadly, this feature does not work in IE.

Published by Geoffrey Liu

A software engineer by trade and a classical musician at heart. Currently a software engineer at Groupon getting into iOS mobile development. Recently graduated from the University of Washington, with a degree in Computer Science and a minor in Music. Web development has been my passion for many years. I am also greatly interested in UI/UX design, teaching, cooking, biking, and collecting posters.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.