Question

当用户上传图片时，应该会出现弹出窗口，此后他将裁剪图片。我想使用php脚本将其上传到文件夹，但我希望裁剪图像和裁剪图像的缩略图存在。裁剪完成后，他将点击上传按钮，上传裁剪后的图像然后创建它的缩略图并上传它们到文件夹。

我尝试了很多插件，但找不到符合我要求的插件。

我尝试过的插件是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/

任何帮助将不胜感激

Answer 1

这是图像裁剪和替换的简单教程首先为选择图像创建视图文件

<!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>

然后创建图像裁剪php文件

    <?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;
   }

  ?>

PHP＆amp; Jquery图像裁剪和上传

1 个答案: