imago.js
It's a wonderful image library! With the purpose to facilitate the manipulation of images, imago.js enables you to perform trimming and resizing. Example page
install
Available on npm and bower:
npm install imago-js
, bower install imago.js
or directly download
basic usage
// create a new imago instancevar imago = document0; // to start a editionimago; // to save edited imageimago; // to cancel current editionimago; // to reset image editionimago;
if the image element already has editing attributes and/or editing elements it will be rendered according to them.
<!-- image with editing attributes --> <!-- image with initial editing elements --> <!-- image with all editing elements -->
constructor
imageElement;
parameters
- imageElement: image element used by the imago constructor.
editing attributes
- data-original-width;
- data-original-height;
- data-width;
- data-height;
- data-top;
- data-left;
editing elements
figure
├ image
├ .crop__mask
├ .crop__wrapper
├ └ .crop__shadow
└ .crop__handler
├ .crop__move-handler
├ .crop__top-left-handler
└ .crop__bottom-right-handler
methods
- imago.edit();
- imago.save();
- imago.cancel();
- imago.reset();
support
- chrome: latest;
- firefox: latest;
- safari: latest;
- internet explore: 9+;
contribute
Everyone can contribute! Finding bugs, creating issues, improving documentation, improving editor it self or creating components. Every contribution will be welcomed! 🎅
Fork it -> Branch it -> Test it -> Push it -> Pull Request it 💎