Best jQuery Image Crop Plugins & Tutorials with Demo

jQuery Select Areas : Image Selection & Resize Plugin

jQuery Select Areas : Image Selection & Resize Plugin

jQuery-select-areas is a jQuery plugin that let you select multiple areas of an image, move them and resize them.

jQuery Slim, Image Upload and Ratio Cropping Plugin

jQuery Slim, Image Upload and Ratio Cropping Plugin

Modern cross platform responsive image cropping and uploading. Slim features beautiful animations and graphics. Configuration and implementation are a walk in the park.

Features:

  • Responsive and Beautifully Animated
  • Compatible with both Bootstrap and Foundation
  • Super Fast
  • Able to auto crop and resize imagery
  • Capable of Correcting Device Orientation problems
  • Setup to upload via AJAX or Form POST
  • A Treat for the Eyes

Resize And Crop Image Using PHP And jQuery

Resize And Crop Image Using PHP And jQuery

Resize and Crop Images is very useful and important technique to save space and bandwidth and it also decrease page execution time and load your webpage much faster.Crop the image when you want to a particluar part of an image to display like only your face and sunset behind you etc.So both are very useful and important technique you can do with your images.In this tutorial we will Resize and Crop an Image Using PHP and jQuery.

Photo Editor : JavaScript Photo Edition Application

Photo Editor : JavaScript Photo Edition Application

Photo Editor is a photo editing application based on the Cropper.js.

Croppie : A jQuery Image Cropper

Croppie : A jQuery Image Cropper

Croppie is a fast, easy to use image cropping plugin with tons of configuration options!

Smartcrop.js : Content Aware Image Cropping

Smartcrop.js : Content Aware Image Cropping

Smartcrop.js is a javascript library implementing content aware image cropping. Smartcrop.js implements an algorithm to find good crops for images.

Enhance.js : Zoom & dynamically Crop Images

Enhance.js : Zoom & dynamically Crop Images

A simple jQuery plugin for image zooming – now with support for object-fit/object-position, powered by Velocity.js animations, complete with some pre-defined image cropping classes.

picEdit : jQuery front-end Image editor Plugin

picEdit : jQuery front-end Image editor Plugin

An attempt to create a simple front-end image editor jQuery plugin that would replace a file-upload input box in a HTML form.The plugin will turn your form’s <input type="file"... box into a tiny image editor/uploader. Perform basic image operations and preview your image before uploading to the server.

Cropimg : jQuery Cropping Plugin

Cropimg : jQuery Cropping Plugin

Another cropping jQuery plugin.Catch image inside the box and move it. You can also zoom in or zoom out the photo by the buttons on right side.

Black elements on image, can be used to short zooming the image or move image to one of the corners, or center

Resizing and Cropping Images with HTML5 Canvas

Resizing and Cropping Images with HTML5 Canvas

In this tutorial we’re going to learn how to resize and crop an image using the HTML5 <canvas> element, and while we’re at it, let’s create some fancy controls for resizing, commonly seen in photo editing applications.