Fork me on GitHub

Example: Basic imagecropper field creation

How to create a imagecropper field.

Basic example

HTML

<div id="field-container"></div>

JavaScript

Implementation

YUI().use('inputex-imagecropper', 'json-stringify', function (Y) {

  var container = Y.one('.demoContainer');

  var cropper = new Y.inputEx.ImageCropperField({
    url: 'http://farm6.staticflickr.com/5222/5878223444_b03cb4e1ac_z.jpg',
    ratio: [3,2],
    value: {origin: [175,49], size: [441,294]},
    minSize: [30,20],
    padding: 30,
    parentEl: container
  });
 
  cropper.on('updated', function (value) {
    container.append(Y.Node.create('<pre>Updated : '+Y.JSON.stringify(value)+'</pre>'));
  });

});