Croppr.js is a lightweight and gorgeous vanilla javascript image crop that has absolutely no dependencies.

Features:

• Lightweight (<6KB minified and compressed)
• Made only with delicious Original Vanilla JS
• Zero Dependencies
• Supports touch devices!
• TypeScript writing included!

A Simple Picture Image Cropper Clipping Plugin for Vue.js

How to make use of it:

Installation:

npm install croppr -—save

// CommonJS
var Croppr = require('croppr');

// ES6 import
import Croppr from 'croppr';

Usage

<img src="path/to/image.jpg" id="croppr"/>

var cropInstance = new Croppr('#croppr', {
  // ...options
});

Options

aspectRatio

Constrain the crop region to an aspect ratio.

• Type: Number
• Default: null
• Example: aspectRatio: 1 (Square)

maxSize

Constrain the crop region to a maximum size.

• Type: [width, height, unit?]
• Default: null
• Example: maxSize: [50, 50, '%'] (A maximum size of 50% of the image size)

Note: unit accepts a value of ‘px’ or ‘%’. Defaults to ‘px’.

minSize

Constrain the crop region to a minimum size.

• Type: [width, height, unit?]
• Default: null
• Example: minSize: [20, 20, 'px'] (A minimum width and height of 20px)

Note: unit accepts a value of ‘px’ or ‘%’. Defaults to ‘px’.

startSize

The starting size of the crop region when it is initialized.

• Type: [width, height, unit?]
• Default: [100, 100, '%'] (A starting crop region as large as possible)
• Example: startSize: [50, 50] (A starting crop region of 50% of the image size)

Note: unit accepts a value of ‘px’ or ‘%’. Defaults to ‘%’.

native javascript image cropper library, Croppr.js plugin/github

See Demo And Download

Official Website(jamesssooi): Click Here

This superior jQuery/javascript plugin is developed by jamesssooi. For extra advanced usage, please go to the official website.