Fork me on GitHub

fileTypeIcon

ファイルタイプに合わせた画像を表示するjQueryプラグインです。

ダウンロード(v0.1.2)

サンプル

ファイルを選択して、そのファイルのタイプ(拡張子)に合わせた画像を表示します。

ファイルはアップロードされるわけではなく、ローカルPC上で動作します。

使い方

アイコンを表示する jQuery object に対して、 fileTypeIcon メソッドを呼び出します。

[ jQuery object ].fileTypeIcon({ file: [ file object ], options);

オプション

オプション 必須 説明
file 必須 アイコンを表示する対象のファイルオブジェクト。原則的に拡張子からファイルのタイプを判断します。
imageDir 任意 初期表示アイコンを含む、アイコンの画像ファイルの格納場所。デフォルトはimage/
defaultIcon 任意 拡張子にあったアイコンが存在しない場合に使用されるデフォルトのアイコン。デフォルトはdefault.png
initIcon 任意 ファイルのタイプに合ったアイコンが表示されるまでに初期表示する画像。デフォルトはinit.gif
initIconSize 任意 initIconのサイズ。widthheightを指定します。デフォルトは両方共に32
imageSize 任意 アイコンの表示サイズ。縦横の長い方のサイズがこのサイズに合わせて表示されます。widthheightを指定します。デフォルトは32
classPrefix 任意 アイコンを表示する要素に付加されるclass属性のprefixを指定します。デフォルトはfti-

拡張子とデフォルトのアイコン

Content-Typeがimage/から始まるものはそのままそのファイルの画像を表示しますが、それ以外のファイルの場合には拡張子からContent-Typeを判断し、それにあった画像を表示します。

デフォルトで設定されている拡張子、Content-Type、それに対応する画像ファイル名は以下のとおりです。

拡張子 Content-Type アイコン
pdf application/pdf pdf-256.png
doc application/msword word-256.png
docx application/vnd.openxmlformats-officedocument.wordprocessingml.document word-256.png
xls application/vnd.ms-excel excel-256.png
xlsx application/vnd.openxmlformats-officedocument.spreadsheetml.sheet excel-256.png
ppt application/vnd.ms-powerpoint powerpoint-256.png
pptx application/vnd.openxmlformats-officedocument.presentationml.presentation powerpoint-256.png