http://qiita.com/ginpei/items/5cebb14e210fc0770e94

• 受け付けたい要素のdragoverイベントとdropイベントを監視する。
• それぞれでevent.preventDefault()する。

• 要素のクラスをon/offする場合
• dragoverでonにする
• dragleaveとdropでoffにする

• dropイベントのevent.dataTransfer.filesにファイル情報が入る。
• 形式はFileオブジェクトの配列。
• Fileオブジェクト:
  • name
  • size
  • type … (ex: "image/png")

• Fileオブジェクトのtypeを確認する。
• type.indexOf('image/')===0なら画像。

• FileオブジェクトからFileReaderオブジェクトのreadAsDataURL()メソッドを使って読み込む。
• 読み込み成功するとloadイベントが発火し、そのevent.target.resultに画像のData-URIが格納されている。

• JavaScript でのローカル ファイルの読み込み - HTML5 Rocks