# jquery-image-reader

> A jQuery plugin that previews image very fast without needing to upload to your server.

Latest version **1.0.0** (published 2016-04-18) · MIT license · 0 weekly downloads

## Install

```sh
npm install jquery-image-reader
pnpm add jquery-image-reader
yarn add jquery-image-reader
bun add jquery-image-reader
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.0 |
| Published | 2016-04-18 |
| First published | 2016-04-18 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 7 |
| Author | Ipan Ardian |
| Maintainers | ipanardian |
| Keywords | jquery, plugin, upload, image, preview, reader, file |

## Links

- npm: https://www.npmjs.com/package/jquery-image-reader
- Repository: https://github.com/ipanardian/image-preview-js
- Homepage: https://github.com/ipanardian/image-preview-js#readme
- Issues: https://github.com/ipanardian/image-preview-js/issues
- npm.io page: https://npm.io/package/jquery-image-reader

## Alternatives

- [unionfs](https://npm.io/package/unionfs.md) — 2.2M weekly downloads
- [path-starts-with](https://npm.io/package/path-starts-with.md) — 35.9K weekly downloads
- [redzip](https://npm.io/package/redzip.md) — 1.2K weekly downloads
- [vscode-anymatch](https://npm.io/package/vscode-anymatch.md) — 848 weekly downloads
- [@ledgerhq/coin-filecoin](https://npm.io/package/@ledgerhq/coin-filecoin.md) — 793 weekly downloads

## Recent versions

- 1.0.0 (latest) — 2016-04-18

## README

# jQuery Image Reader
[![contributions welcome](https://img.shields.io/badge/contributions-welcome-brightgreen.svg?style=flat)](https://github.com/ipanardian/jquery-image-reader/issues) 
[![Join the chat at https://gitter.im/ipanardian/jquery-image-reader](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/ipanardian/jquery-image-reader)
[![Release](https://img.shields.io/badge/release-v1.0--beta-orange.svg)](https://github.com/ipanardian/jquery-image-reader/releases)
[![Dependencies](https://img.shields.io/badge/dependencies-jQuery%202.x-blue.svg)](https://jquery.com/)
[![GitHub license](https://img.shields.io/badge/license-MIT-red.svg)](https://raw.githubusercontent.com/ipanardian/jquery-image-reader/master/LICENSE)
[![HitCount](https://hitt.herokuapp.com/ipanardian/jquery-image-reader.svg)](https://github.com/ipanardian/jquery-image-reader)

A jQuery plugin that previews image very fast without needing to upload to your server.

This plugin implement FileReader API so you can asynchronously read the contents and avoid server uploads of raw user files.  You can also pre-treat content before you manually upload user content to your servers.

## Demo
[http://indosystem.github.io/jquery-image-reader](http://indosystem.github.io/jquery-image-reader)

## Usage
```html
<!-- HTML -->
<input type="file" id="upload-file" multiple /><br/>
<div id="image-preview"></div>
```

```js
// JS
$('#upload-file').imageReader();

// or
$('#upload-file').imageReader({
  destination: '#image-preview'
});

// callback
$('#upload-file').imageReader({
	onload: function(img) {
		// your callback code
		console.log({
			width: img.width,
			height: img.height
		});
		$(img).css('margin-top', '20px');
	}
});
```

## Install
```
bower install jquery-image-reader
```

## Browser compatibility
The Uncompressed file implement new features from the JavaScript ECMA-262 specification (ES6) while the compressed file has transpiled using Babel.js into equivalent code.
 
Tested on Chrome 49, Safari 9.1, Firefox 43. Chrome and Firefox for Android. 

[https://developer.mozilla.org/en-US/docs/Web/API/FileReader#Browser_compatibility] (https://developer.mozilla.org/en-US/docs/Web/API/FileReader#Browser_compatibility)

## License
The MIT License (MIT)

---
_Source: https://npm.io/package/jquery-image-reader · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._