<?
if ($_SERVER['REQUEST_METHOD'] == 'POST')
{
$file="7.jpg";
$imgs=imagecreatefromjpeg($file);
$x=imagesx($imgs);
$y=imagesy($imgs);
$x1=$_POST['x1'];
$x2=$_POST['x2'];
$y1=$_POST['y1'];
$y2=$_POST['y2'];
$w=$_POST['w']; //目标的宽度;
$h=$_POST['h']; //高
//imagecopyresampled ($目标图像资源,$源图像资源,$目标图像X轴,目标图像Y轴,$源图像X轴,$源图像Y轴,$目标图像宽度,$目标图像高度,$源图像宽度,$源图像高度 );
$imgt=imagecreatetruecolor($w,$h);
//imagecopyresized($imgt,$imgs,0,0,$x1,$y1,$w,$h,$w,$h);
imagecopyresampled($imgt,$imgs,0,0,$x1,$y1,$w,$h,$w,$h);
imagejpeg($imgt,"dcd.jpg");
imagedestroy($imgt);
imagedestroy($imgs);
echo "<img src=dcd.jpg />";
}
?>
<html>
<head>
<script src="jquery.min.js"></script>
<script src="jquery.Jcrop.js"></script>
<link rel="stylesheet" href="jquery.Jcrop.css" type="text/css" />
<link rel="stylesheet" href="demos.css" type="text/css" />
<script language="Javascript">
jQuery(document).ready(function(){
$('#cropbox').Jcrop({
onChange: showCoords,
onSelect: showpic
});
});
function showpic(){
// alert('dc');
}
function showCoords(c)
{
$('#x1').val(c.x);
$('#y1').val(c.y);
$('#x2').val(c.x2);
$('#y2').val(c.y2);
$('#w').val(c.w);
$('#h').val(c.h);
if (parseInt(c.w) > 0)
{
var rx = 100 / c.w;
var ry = 100 / c.h;
$('#slt').css({
width: Math.round(rx*c.w) + 'px',
height: Math.round(ry *c.h) + 'px',
marginLeft: '-' + Math.round(rx * c.x) + 'px',
marginTop: '-' + Math.round(ry * c.y) + 'px'
});
}
};
</script>
</head>
<body>
<img src="7.jpg" id="cropbox" />
<form method="post" action="">
<label>X1 <input type="text" size="4" id="x1" name="x1" /></label>
<label>Y1 <input type="text" size="4" id="y1" name="y1" /></label>
<label>X2 <input type="text" size="4" id="x2" name="x2" /></label>
<label>Y2 <input type="text" size="4" id="y2" name="y2" /></label>
<label>W <input type="text" size="4" id="w" name="w" /></label>
<label>H <input type="text" size="4" id="h" name="h" /></label>
<input type="submit" value="生成" />
</form>
<div style="width:100px;height:100px;overflow:hidden;">
<img src="7.jpg" id="slt" />
</div>
</body>
</html>
分享到：
相关推荐
**正文** ...前端利用Jcrop实现交互式选取，后端用Java处理裁剪逻辑。通过这种方式，我们可以创建一个完整的图片裁剪服务，满足用户自定义裁剪需求，同时利用后端的强大处理能力确保裁剪的精度和效率。
4. **截图分享**：结合浏览器的截图API，用户可以先截取整个网页，然后用Jcrop选择要分享的部分。 5. **照片墙布局**：用户可以选择照片的裁剪区域，以适应不同比例的照片墙布局。 四、Jcrop的进一步扩展 1. **与...
本教程将详细介绍如何使用ThinkPHP框架、jQuery库、Jcrop图像裁剪工具以及AjaxFileUpload插件实现一个无刷新的图片上传和裁剪功能，最后将裁剪后的图片保存到数据库。 首先，`ThinkPHP`是一个流行的PHP框架，它提供...
ASP.NET 实现的用uploadify(uploadify-v2.1.4)上传图片，然后用jcrop裁剪需要的区域，然后上传到服务器中。 完整DEMO，放心下载。 浏览器兼容性没怎么测试，在chrome下没问题
**标题详解：** "jcrop JavaScript图片截取工具" 是一个基于JavaScript的开源库，用于在网页上实现图片的选择和裁剪功能。它无需依赖Flash技术，因此可以在各种现代浏览器和移动设备上运行，提供了良好的跨平台兼容...
`demo_JQuery.Jcrop`可能是包含`Jcrop`插件的示例代码，而`JQ图片放大效果`可能是一个展示如何用jQuery实现图片放大功能的代码片段。要深入学习和实践，你可以查阅这两个文件的内容，理解并应用到自己的项目中。记住...
3. **多选区支持**：Jcrop还支持多个选区，这在处理需要多张裁剪图片的场景下非常有用。 4. **坐标与比例保存**：用户选择的裁剪区域坐标和比例可以被保存，便于下次加载时直接应用。 5. **事件监听**：Jcrop提供...
3.利用jcrop裁剪工具对图片进行裁剪并且实时预览 4.点击确定按钮将裁剪用到的参数传入后台，后台图片进行剪切，之后缩放成我们需要的格式 5.最后将图片路径传到前台进行展示 前台页面代码为： <script src="j
`jCrop` 是一个基于 jQuery 的轻量级图片裁剪插件，它为开发者提供了便捷的方式来实现这一功能。本篇文章将深入讲解如何使用 `jCrop` 进行图片剪裁，以及如何将它集成到你的项目中。 ### jCrop 简介 `jCrop` 是由 ...
在实际应用中，这些技术的结合使用能提供一个完整的图片处理流程：用户通过Uploadify上传图片，后端接收并压缩图片，然后将压缩后的图片URL返回给前端，前端用这个URL显示图片，并通过Jcrop进行裁剪操作。...
首先，Jcrop的名称来源于“JavaScript Crop”，顾名思义，它是一个用JavaScript编写的图片裁剪工具。它支持现代浏览器，如Chrome、Firefox、Safari和IE9+，并兼容触控设备，满足了多样化的用户需求。Jcrop的核心功能...
【Java Servlet版图片裁剪】技术是Web开发中一种实现图像处理的方式，它结合了Java Servlet、AJAX和JCrop库，提供了用户友好的图片裁剪功能。在本项目中，开发者利用Servlet作为服务器端的核心处理组件，处理来自...
Jcrop是一个jQuery插件，它能为你的WEB应用程序快速简单地提供图片裁剪的功能。 特点： 对所有图片均unobtrusively（无侵入的，保持DOM简洁） 支持宽高比例锁定 支持 minSize / maxSize设置 支持改变选区或移 动选区...
接收Blob数据后，可以先将其转换为字节数组，然后使用`ImageIO.read()`方法读取图片，再用`BufferedImage`类提供的裁剪方法`getSubimage()`进行裁剪。最后，通过`ImageIO.write()`将裁剪后的图片保存到文件系统。 ...
该资源是自己做的（后台是java，页面是jsp，用了Jcrop插件裁剪图片），能实现上传本地图片,预览在页面上并根据用户的需求进行任意大小的裁剪，最后将裁剪后的图片进行展示。整个过程会把图片的名字插入数据库字段；...
2. **图片裁剪**：结合Jcrop选定的坐标，Asido可以准确地裁剪出用户选择的部分。 3. **质量控制**：Asido允许调整生成图片的质量和格式，平衡图像质量和文件大小。 4. **缓存管理**：可以有效地缓存处理后的图片，...
JQuery Jcrop是一个强大的JavaScript库，它允许用户通过在网页上拖动选择区域来裁剪图片，然后将裁剪参数传递给服务器端，通常用PHP进行实际的图片处理。 首先，我们来看HTML部分。HTML页面包含了一个`<img>`标签，...