Skip to content
This repository was archived by the owner on May 25, 2023. It is now read-only.

Browser support

blueimp edited this page Oct 16, 2012 · 63 revisions

Multiple File selection

The following browsers support multiple file selection:

  • Firefox 3.6+
  • Safari 5+
  • Google Chrome
  • Opera 11+

Internet Explorer has no support for multiple file selection, but allows to add multiple files to the upload queue by selecting files multiple times.

Note: Safari on Windows has a bug and reports a file size of 0 bytes when selecting multiple files. Selecting single files works.

Folder selection

It is possible to select a complete folder structure, though this is currently only supported by Google Chrome.
To enable this feature, the following vendor-specific directory attributes have to be added to the file input field:

<input type="file" name="files[]" multiple directory webkitdirectory mozdirectory>

Drag & Drop

The following browsers support drag & drop:

  • Firefox 4+
  • Safari 5+
  • Google Chrome
  • Opera 12+

IE has currently no support for drag & drop.

Note: Safari on Windows has a bug that adds "" characters at the end of the file name or mangles the file name in another way and reports a file size of 0 bytes when dropping files. Trying to drop the same file(s) again seems to work.

Folder Drag&Drop

It is possible to drag&drop a complete folder structure, though this is currently only supported by Google Chrome.

Firefox 3.6

The outdated v4 branch of the plugin supported drag & drop for Firefox 3.6, but since version 5 of the plugin, drag&drop is not supported on versions below Firefox 4 anymore (for multipart uploads).

The reason for this is that Firefox 3.6 does not support the FormData interface for multipart form uploads and required extra code using the FileReader interface to built a multipart/form-data upload. This code was rather inefficient for large files and since version 4 of Firefox is stable and widespread and selecting files still works on Firefox 3.6 the extra code has been removed for the rewritten version 5 of the plugin.

It is still possible to enable drag & drop support on Firefox 3.6 with version 5 of the plugin by setting the multipart option to false (see Options).

Upload progress

The following browsers have complete support for upload progress indication:

  • Firefox 4+
  • Safari 5+
  • Google Chrome
  • Opera 12+

Firefox 3.6 and Opera 11.1 have partial upload progress support via the global progress bar, which will update after each iframe based upload with the percentage of the uplaoded files compared to all file selections in the upload queue. This is possible as those browsers support the File API and report the file size of the uploaded files, although they lack the interfaces for XMLHttpRequest uploads.

All versions of Internet Explorer will also update the global progress bar after each iframe based upload. However since IE does not report the file size, the global progress bar will measure each uploaded file the same without regard to the size of the uploaded file.

Note:
Depending on the size of the file, the operating system platform and the network throughput, the number of progress events triggered might differ.
e.g. Google Chrome might only trigger one progress event for the upload of a 100KB file on Windows XP, but trigger multiple progress events for the same file on Windows 7 and Mac OSX (tested with Google Chrome version 22.0.1229.94).

Image previews

The following browsers have support for image previews prior to uploading files:

  • Firefox 3.6+
  • Safari 6+
  • Google Chrome
  • Opera 11+

File meta data

The following browsers report complete file meta data prior to uploading files:

  • Firefox 3.6+
  • Safari 4+
  • Google Chrome
  • Opera 10+

Internet Explorer only reports the file name.

The reported file meta data consists of the following properties:

  • name: The name of the file, e.g. banana.jpg.
  • size: The size of the file in bytes, e.g. 130073 (131 KB).
  • type: The type of the file, e.g. image/jpg.

XMLHttpRequest File Uploads

The following browsers support XHR file uploads, which allows advanced usage of the file upload API:

  • Firefox 4+
  • Safari 5+
  • Google Chrome
  • Opera 12+

If the multipart option is set to false (see Options), Firefox 3.6 also supports XHR file uploads.

The Iframe Transport is used for other browsers. The Iframe Transport requires a file input selection to upload files.

Image Resizing Functionality

The following browsers support client-side image resizing functionality:

  • Firefox 4+
  • Safari 6+
  • Google Chrome
Clone this wiki locally