Image crop View all kinds of Image crop examples below.

Image crop

Use the markup below to add image cropping functionality to your app.

Basic

This is a basic image cropping example. To select a cropping zone, drag the mouse over the image.

Event handler

In this example, the form values are updated in real-time as the selection is changed.

X1

Y1

X2

Y2

W

H

Preview pane

An example implementing a preview pane.

Animations and transitions

Demonstration of animateTo API method and transitions for bgColor and bgOpacity options.

Enable fading (bgFade: true)