Simple Image Cropper In jQuery

A simple jQuery image cropper plugin that allows you to crop an image to a specific dimension on the client side.

It automatically detects the aspect ratio of the cropper's container element and displays a crop area on the image selected from local.

Once the image has been cropped, the plugin then attaches the cropped image (base64 encoded) to that container element.

How to use it:

1. Load the necessary jQuery library and Jcrop plugin in the document.

<!-- jQuery -->
<script src="/path/to/cdn/jquery.min.js"></script>

<!--JCrop plugin -->
<link rel="stylesheet" href="/path/to/jcrop/jquery.Jcrop.min.css" />
<script src="/path/to/jcrop/jquery.Jcrop.min.js"></script>

2. Load the Simple Image Cropper's JavaScript and CSS in the document.

<link rel="stylesheet" href="css/style.css" />
<script src="scripts/jquery.SimpleCropper.js"></script>

3. Create an empty container to hold the image cropper.

<div class="cropme"></div>

4. Initialize the image cropper by calling the function simpleCropper on the container element you just created.

$('.cropme').simpleCropper();

---

This awesome jQuery plugin is developed by hane-smitter. For more Advanced Usages, please check the demo page or visit the official website.