JQuery: Define crop section area of image

October 04, 2015 0 Comments

If you want to crop image then use JQuery Crop plugin. Download JQuery Crop Plugin from Here. Here you get two file, first is jquery.JCrop.js and second one is jquery.Jcrop.css file. Both of these files are used to set the crop section area on image. Lets check the example of Jquery crop section area of image.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <script src="http://code.jquery.com/jquery-1.8.2.js"></script>
    <script src="jquery.Jcrop.js"></script>
    <link href="jquery.Jcrop.css" rel="stylesheet" />
        $(function () {
                onSelect: croparea


        function croparea(c) {


        <img src="image/12.PNG" id="cropimage"/>
        <input type="hidden" id="coordinate_x" />
        <input type="hidden" id="coordinate_y" />
        <input type="hidden" id="coordinate_w" />
        <input type="hidden" id="coordinate_h" />



Code generate the following output

JQuery: Define crop section area of image

Jacob Lefore

Some say he’s half man half fish, others say he’s more of a seventy/thirty split. Either way he’s a fishy bastard. Google