Tweet

HTML5 Image Preview

Display images in multiple sizes before uploading. This script does not require third party libraries such as jQuery or Mootools and works on majority of devices including Android and iOS.

Check-out my new project Badge Fever!

Installation

  1. Download the package and copy html5.image.preview.min.js to desired folder
  2. Include script in your HTML document
  3. Add onChange event to your input field: onchange="previewImage(this,[sizes],limit);"

    * limit is number of Mb

Examples

Single Size

Multiple Sizes

Styled Image Preview