This example covers image prviews with different preview sizes, Also shows X & Y co-ordinates and width - height of the cropper. With Rotate buttons you can rotate the image clockwise and anti-clockwise. You can also scale the image with horizontal flip and vertical flip buttons. You can get all data, image data, container data, canvas data and cropbox data clicking on respective buttons.
This is the most basic example with cropper shown with overlay on the image.
This is the most basic example with cropper shown on the image but without overlay.
This example demonstrate the cropper ratio fixed to 16:9
. This must be set using the aspectRatio
option.
This example demonstrate the cropper ratio fixed to 4:3
. This must be set using the aspectRatio
option.
This example demonstrate the fixed cropper that you can not move but you can increase - decrease the size of the cropper by dragging.
This example demonstrate the fixed size of the cropper. You can move the crop box but can not increase or decrease the size of the cropper.
This example demonstrate the guides being turned off.
This example demonstrate how to disable the center indicator while still showing the guides.
This example demonstrate how to disable the autocrop feature. You need to set autoCrop
option to false
in order to disable.
This example demonstrate how to restrict a user from creating a new cropbox and just allowing to work with pre-defined cropbox.
This example demonstrate how to enable the image movement while keeping the cropbox fixed.
This example demonstrate how to enable zoom functionality on mousewheel scroll.
In this example we have set minimum crop area size to 100 X 100
. User can not make smaller cropbox than limit applied.
This example demonstrate how to disable the default background. Set background
option to false
in order to disable default background.
This example demonstrate how to rotate the default image. Required to use built
function to rotate image after setting all the options.
This example demonstrate how to scale the default image. Required to use built
function to scale image after setting all the options.