<?php
include("../common/common.php");
include("../common/file.php");
/**
* Jcrop image cropping plugin for jQuery
* Example cropping script
* @copyright 2008 Kelly Hallman
* More info: http://deepliquid.com/content/Jcrop_Implementation_Theory.html
*/
if ($_SERVER['REQUEST_METHOD'] == 'POST')
{
$targ_w = $targ_h = 200;
$src = 'jcrop.jpg';
$img_r = imagecreatefromjpeg($src);
$dst_r = ImageCreateTrueColor( $targ_w, $targ_h );
imagecopyresampled($dst_r,$img_r,0,0,$_POST['x'],$_POST['y'],
$targ_w,$targ_h,$_POST['w'],$_POST['h']);
$fileName = $_SC['webpath'].'/images/test/jcrop.jpg';
//header('Content-type: image/jpeg');
$webroot = $_SC['webpath'].'/images/test/t0.jpg';
imagejpeg($dst_r,$webroot,100);
$destArr = array($_SC['webpath'].'/images/test/t1.jpg',$_SC['webpath'].'/images/test/t2.jpg');
$wtArr = array(array(100,100),array(50,50));
if(file_exists($webroot)){
echo "正在截剪";
makeThumb($webroot,$destArr,$wtArr);
}else{
echo "没有文件".$webroot;
}
exit;
}
// If not a POST request, display page below:
?><html>
<head>
<script src="../js/jquery.min.js"></script>
<script src="../js/jquery.Jcrop.min.js"></script>
<link rel="stylesheet" href="jcrop.css" type="text/css" />
<link rel="stylesheet" href="jquery.Jcrop.css" type="text/css" />
<script language="Javascript">
$(function(){
$('#cropbox').Jcrop({
aspectRatio: 1,
onSelect: updateCoords,
setSelect: [100,100,300,300],
minSize:[200,200],
addClass: 'custom',
bgColor: 'yellow',
bgOpacity: .8,
sideHandles: false
});
});
function updateCoords(c)
{
$('#x').val(c.x);
$('#y').val(c.y);
$('#w').val(c.w);
$('#h').val(c.h);
};
function checkCoords()
{
if (parseInt($('#w').val())) return true;
alert('Please select a crop region then press submit.');
return false;
};
</script>
</head>
<body>
<div id="outer">
<div class="jcExample">
<div class="article">
<h1>Jcrop - Crop Behavior</h1>
<!-- This is the image we're attaching Jcrop to -->
<img src="jcrop.jpg" id="cropbox" />
<!-- This is the form that our event handler fills -->
<form action="jcrop.php" method="post" onsubmit="return checkCoords();">
<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="submit" value="Crop Image" />
</form>
<p>
<b>An example server-side crop script.</b> Hidden form values
are set when a selection is made. If you press the <i>Crop Image</i>
button, the form will be submitted and a 150x150 thumbnail will be
dumped to the browser. Try it!
</p>
<div id="dl_links">
<a href="http://deepliquid.com/content/Jcrop.html">Jcrop Home</a> |
<a href="http://deepliquid.com/content/Jcrop_Manual.html">Manual (Docs)</a>
</div>
</div>
</div>
</div>
</body>
</html>
分享到：
相关推荐
在本项目中，“PHP+jQuery+jCrop裁剪头像”是一个常见的在线图像处理应用场景，用于让用户自定义上传的头像尺寸，以满足特定的显示需求。以下是对该项目中涉及的关键技术点的详细解释： 1. **PHP**：PHP（Hypertext...
标题 "PHP+jQuery+jCrop在线上传裁剪头像(内含源码)" 涉及的是一个基于Web的图像处理应用，它允许用户上传图片并进行裁剪，以创建自定义的头像或其他需要的图像尺寸。这个系统的核心技术包括PHP、jQuery和jCrop。 1...
本项目通过结合Jcrop、Uploadify和PHP技术，为用户提供了一个直观且实用的头像预览和裁剪解决方案。 首先，让我们详细了解一下这三个关键组件： 1. **Jcrop**： Jcrop是一款强大的JavaScript图像裁剪工具，它允许...
本项目"PHP+Jcrop+ajaxfileupload头像上传"提供了一个完整的解决方案，将前端图像选择、裁剪与后端处理相结合，为用户提供流畅的上传体验。以下是关于这个项目的关键知识点的详细说明： 1. PHP：PHP是一种广泛使用...
这在上传头像、图片编辑或需要预览裁剪效果的场景中非常有用。 要开始使用Jcrop，首先需要在项目中引入jQuery和Jcrop的JavaScript与CSS文件。通常，你可以从Jcrop的官方网站下载最新版本的库文件，或者通过CDN链接...
总的来说，这个Demo展示了如何将前端的Jcrop裁剪功能与PHP后端结合，实现用户头像的上传和截取。通过这种方式，我们可以为用户提供更灵活的头像定制服务，提升用户体验。在实际项目中，还可以根据具体需求进行扩展，...
本项目涉及的技术栈是PHP、Jcrop和artDialog，它们分别在头像上传过程中担任不同的角色。 PHP（Hypertext Preprocessor）是一种广泛使用的开源服务器端脚本语言，尤其适合Web开发。在头像上传场景中，PHP主要负责...
在本文中，我们将深入探讨如何使用PHP、AjaxFileUpload和jCrop插件来实现一个功能完善的头像上传和裁剪系统。这个系统的核心是通过异步上传头像，然后利用图像处理工具进行精确的裁剪，以达到理想的显示效果。 首先...
**jQuery头像截取jCrop详解** 在网页应用中，用户常常需要上传个人头像，为了提供更好的用户体验，我们可以利用JavaScript库实现头像的预览和裁剪功能。`jQuery jCrop` 就是一个这样的工具，它允许用户在上传图片前...
在本实例中，我们主要探讨如何使用PHP与前端技术AJAX、FileUpload和Jcrop插件相结合，实现一个完整的头像上传及剪裁功能。这个功能常见于许多社交媒体和个人资料编辑页面，允许用户自主选择并调整上传的头像图片。 ...
标题中的"jcrop做一个上传头像"指的是使用Jcrop这个JavaScript库来实现用户上传图片并进行裁剪的功能。Jcrop是一款强大的图像裁剪工具，它允许用户在网页前端选择并裁剪图片，然后将裁剪的坐标信息发送到后台服务器...
总结来说，"头像上传裁剪插件"是一个结合了前端交互和后端处理的实用工具，通过JavaScript的JCrop库和PHP的图像处理功能，为用户提供了一种简单易用的头像定制方式。在开发这类插件时，需要兼顾用户体验、安全性、...
通过添加Jcrop到网页中，用户可以在预览图像上选择一个区域，然后服务器端的PHP程序可以使用这些坐标信息来裁剪原始图像，生成用户所需的头像。 2. **HTML和CSS**： 在前端，我们需要创建一个HTML表单来上传图片，...
本文将深入探讨如何使用`jcrop_js`库来实现一个高效且用户友好的头像上传及截图功能，以此提升用户在微博上的个性化体验。 `jcrop_js`是一款基于JavaScript的图像裁剪工具，它允许用户在网页上自由选择图像的特定...
Jcrop的核心功能是提供了一个用户友好的界面，让用户可以自由选择图像的裁剪区域，这在需要用户上传并定制头像、产品图片或其他需要精确裁剪的场景中非常有用。 Jcrop的关键特性包括： 1. **实时预览**：用户在...
- 用户头像裁剪：用户可以选择并裁剪自己的头像，确保符合规定的尺寸和比例。 - 商品图片处理：电商平台可以让商家上传商品图片并自由裁剪，保持统一的展示效果。 - 照片编辑应用：在线照片编辑工具中，用户可以...
这个插件允许用户在网页上动态选择图像的一部分，并可以将其裁剪为所需的尺寸，广泛应用于头像上传、图片编辑器、预览等功能。 **主要特性：** 1. **交互式选取**：Jcrop通过动态生成的选区框让用户能够直观地选取...
本话题主要聚焦于使用PHP和jQuery插件实现小图裁剪功能，尤其适用于处理头像上传的场景。我们将深入探讨这个过程中的关键技术和步骤。 首先，我们需要理解jQuery插件在这一过程中的作用。jQuery是一种广泛使用的...