Drag and drop a file on a hidden <div>

I would like to implement drag and drop functionality for uploading files same as in google docs. I have been trying to work out this functionality but all my efforts are in vain.

Initially the <div> on which a file has to be dropped should be hidden. When a file is dragged over that <div> it should be visible. I am not able to achieve this functionality.

I can do rest of functionality i.e., uploading a file after it has been dropped in the div.