ファイルを選択して、そのファイルのタイプ(拡張子)に合わせた画像を表示します。
ファイルはアップロードされるわけではなく、ローカルPC上で動作します。
アイコンを表示する jQuery object
に対して、 fileTypeIcon
メソッドを呼び出します。
[ jQuery object ].fileTypeIcon({ file: [ file object ], options);
オプション | 必須 | 説明 |
---|---|---|
file |
必須 | アイコンを表示する対象のファイルオブジェクト。原則的に拡張子からファイルのタイプを判断します。 |
imageDir |
任意 | 初期表示アイコンを含む、アイコンの画像ファイルの格納場所。デフォルトはimage/ |
defaultIcon |
任意 | 拡張子にあったアイコンが存在しない場合に使用されるデフォルトのアイコン。デフォルトはdefault.png |
initIcon |
任意 | ファイルのタイプに合ったアイコンが表示されるまでに初期表示する画像。デフォルトはinit.gif |
initIconSize |
任意 | initIconのサイズ。width とheight を指定します。デフォルトは両方共に32 |
imageSize |
任意 | アイコンの表示サイズ。縦横の長い方のサイズがこのサイズに合わせて表示されます。width とheight を指定します。デフォルトは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 |