jQuery製で手軽に使えるHTML5による画像のドラッグアンドドロップアップローダー「Droparea」
DropareaはHTML5/jQueryで画像のドラッグアンドドロップによるファイルアップロードを行うライブラリ。
DropareaはHTML5/JavaScript製のオープンソース・ソフトウェア。HTML5によって大きく改善されたWebの機能の一つがファイルアップロードではないだろうか。複数のファイルがアップロードできるようになったり、ドラッグアンドドロップでもアップロードできるようになった。
アップロードするとすぐにサムネイルが表示される
ドラッグアンドドロップでのアップロードとしてはGmailが有名だが、ファイルを持っていってはじめてドロップできることに気づくのでは使い勝手が良いとは思えない。それをもう少し分かりやすくしたのがDropareaだ。
DropareaはWebページに写真をアップロードするjQueryプラグインだ。特徴としてアップロードできる部分があらかじめ指定されているということがある。複数の箇所に対して写真をドロップすると自動的にアップロードが開始されてサムネイルが表示される。
ファイルを持っていくと色が変わる
jQuery製なので使い方は簡単だ。アップロード（POST）先のURLさえ指定すれば、後はアップロード場所をタグで囲むだけだ。Dropareaでは画像だけだが、特に他のファイルでも問題はないと思われる（data-typeは変更すべきだろう）。自分のプロジェクトでも取り入れてみたいと思える、そんな便利なライブラリだ。
MOONGIFTはこう見る
DropareaがテストしているのはGoogle Chrome11とFirefox3.6とのこと。試してみたがやはりIE7では動かなかった。この点がHTML5を取り入れていくのを躊躇させてしまう問題と言えそうだ。通常のファイルアップロードも使いつつ、モダンなWebブラウザ向けの機能として考えなければならない。
だがそれでもHTML5を使って利便性高いサービスを目指していくべきだろう。全てをHTML5で実装する訳ではなくとも、必要な機能だけHTML5化して取り組んでみるのはどうだろう。そうした実践の中でこそ、利便性が分かってくるケースは多いはずだ。
via Droparea - HTML5 Drag & Drop Image File Uploader Plugin for jQuery | blogfreakz.com