Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
menu search
person
Welcome To Ask or Share your Answers For Others

Categories

When a user uploads a picture, pop up window should come, where he'll crop the image, after this is done. I want to use php script to upload this to folder but i want cropped image and thumbnail of cropped image to be present.After cropping is done,then he'll click upload button which will upload cropped image then create thumbnail of it and upload them to a folders.

I tried many plug-ins but could not find one for my requirement.

Plug-ins that i tried are http://deepliquid.com/projects/Jcrop/demos.php

http://net.tutsplus.com/tutorials/javascript-ajax/how-to-create-a-jquery-image-cropping-plug-in-from-scratch-part-ii/

Any help would be appreciated

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
156 views
Welcome To Ask or Share your Answers For Others

1 Answer

This is simple tutorial for image crop and replace First create view file for select image

<!DOCTYPE html>
 <html lang="en">
 <head>
 <script type="text/javascript"     src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.Jcrop.js"></script>
<script type="text/javascript" src="js/cropsetup.js"></script>
</head>
 <body>
<div id="wrapper">
 <div class="jc-demo-box">
 <img src="uploads/Chrysanthemum.jpg" id="target" alt="[Jcrop Example]" />
  <div id="form-container">
  <form id="cropimg" name="cropimg" method="post" action="crop.php" target="_blank">
          <input type="hidden" id="x" name="x">
          <input type="hidden" id="y" name="y">
          <input type="hidden" id="w" name="w">
          <input type="hidden" id="h" name="h">
          <input type="hidden" id="image_name" name="image_name" value="uploads/Chrysanthemum.jpg">
          <input type="submit" id="submit" value="Crop Image!">
  </form>
</div>
 </div>
</div>
</body>
</html>

then create image crop php file

    <?php

    if ($_SERVER['REQUEST_METHOD'] == 'POST') {
$targ_w =$_POST['w'];
$targ_h =$_POST['h'];

$jpeg_quality = 90;

if(!isset($_POST['x']) || !is_numeric($_POST['x'])) {
  die('Please select a crop area.');
}

$src = $_POST['image_name'];
$system = explode(".", $src);

if (preg_match("/jpg|jpeg/", $system[1]))
{
    $src_img=imagecreatefromjpeg($src);
}
if (preg_match("/png/", $system[1]))
{
    $src_img = imagecreatefrompng($src);
}
if (preg_match("/gif/", $system[1]))
{
    $src_img = imagecreatefromgif($src);
}

$dst_r = ImageCreateTrueColor($targ_w, $targ_h);

imagecopyresampled($dst_r,$src_img,0,0,$_POST['x'],$_POST['y'],
$targ_w,$targ_h,$_POST['w'],$_POST['h']);

if (preg_match("/png/", $system[1]))
{
    imagepng($dst_r, $_POST['image_name']); 
} 
else if (preg_match("/gif/", $system[1]))
{
    imagegif($dst_r, $_POST['image_name']);
}
else
{
    imagejpeg($dst_r, $_POST['image_name']); 
}

imagedestroy($dst_r);   
imagedestroy($src_img);

exit;
   }

  ?>

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
...