A jQuery plugin wrapper for Cropper.js.
A jQuery plugin wrapper for Cropper.js 1.0.
dist/
├── jquery-cropper.js (UMD)
├── jquery-cropper.min.js (UMD, compressed)
├── jquery-cropper.common.js (CommonJS, default)
└── jquery-cropper.esm.js (ES Module)npm install jquery-cropper jquery cropperjs@1Include files:
Initialize with $.fn.cropper method.
/* Limit image width to avoid overflow the container */
img {
max-width: 100%; /* This rule is very important, please do not ignore this! */
}var $image = $('#image');
$image.cropper({
aspectRatio: 16 / 9,
crop: function(event) {
console.log(event.detail.x);
console.log(event.detail.y);
console.log(event.detail.width);
console.log(event.detail.height);
console.log(event.detail.rotate);
console.log(event.detail.scaleX);
console.log(event.detail.scaleY);
}
});
// Get the Cropper.js instance after initialized
var cropper = $image.data('cropper');See the available options of Cropper.js 1.0.
$().cropper(options);See the available methods of Cropper.js 1.0.
$().cropper('method', argument1, , argument2, ..., argumentN);See the available events of Cropper.js 1.0.
$().on('event', handler);If you have to use other plugin with the same namespace, just call the $.fn.cropper.noConflict method to revert to it.
It is the same as the browser support of Cropper.js 1.0. As a jQuery plugin, you also need to see the jQuery Browser Support.
Please read through our contributing guidelines.
Maintained under the Semantic Versioning guidelines.
No open issues yet, or sync has not completed.