<?
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是一款基于jQuery的开源图片裁剪插件，它提供了简单易用的API，使得开发者能够轻松地在网页中实现按比例或自由裁剪图片的功能。本文将详细介绍Jcrop的特性、使用方法以及如何通过其提供的示例快速上手。 首先...
- **图片裁剪服务**：提供一个简单的图片裁剪工具，用户可以快速地调整和裁剪图片。 - **屏幕截图**：虽然Jcrop本身不直接支持屏幕截图，但可以结合其他截图库，让用户选择截取屏幕的特定部分。 总的来说，jQuery ...
jcrop是一款开源的JavaScript组件，它提供了一种直观且易于使用的界面，让用户能够通过鼠标操作在网页上选择图片的特定区域进行裁剪。该库支持多种浏览器，包括Chrome、Firefox、Safari、Edge等，兼容性良好。 2. ...
Jcrop是一款广泛使用的JavaScript图像裁剪工具，它允许用户在网页上交互式地选择和裁剪图片。这个“jcrop图片裁剪demo”是展示如何集成和应用Jcrop的一个实例，方便开发者快速理解和使用。下面将详细介绍Jcrop的核心...
**jQuery Jcrop是一款非常实用的JavaScript图片裁剪工具，它为网页开发人员提供了一种简单易用的方法来实现用户交互式的图像裁剪功能。在网页上，用户可以自由选择图片的裁剪区域，从而实现自定义尺寸的图片生成。**...
在本项目中，“PHP+jQuery+jCrop裁剪头像”是一个常见的在线图像处理应用场景，用于让用户自定义上传的头像尺寸，以满足特定的显示需求。以下是对该项目中涉及的关键技术点的详细解释： 1. **PHP**：PHP（Hypertext...
上述代码中，`#target`是待裁剪图片的ID，`Jcrop();`是初始化Jcrop的函数，通过jQuery选择器将Jcrop应用到指定的图片元素上。 Jcrop提供了一些关键配置选项，以满足不同需求。例如，你可以设置选区的最小和最大尺寸...
在本文中，我们将深入探讨如何使用Jcrop实现剪切上传图片以及相关的操作实例。 首先，Jcrop是基于jQuery库的，因此在使用Jcrop之前，你需要确保你的项目中已经引入了jQuery。你可以通过CDN或者本地文件的方式引入...
`jCrop` 是一个基于 jQuery 的强大图片裁剪插件，它允许用户在浏览器端选择并裁剪图像，然后将这些裁剪信息发送到服务器进行进一步处理。在这个项目中，`jCrop` 被用来配合 PHP 完成图片的上传和剪切功能。 1. **...
$('#target').Jcrop({ minSize: [190,190], //边框最小尺寸 //maxSize:[190,190], setSelect: [0,0,170,230], //创建边框参数【x,y,x1,y1】 onChange: updatePreview, //边框改变时发生的事件 onSelect: ...
struts2+jsp+jquery+Jcrop实现图片裁剪并上传, 参照http://blog.csdn.net/csd_xuming/article/details/8848939 的有效实现实例
这个"java+jq+jcrop缩放裁剪上传图片"的主题涵盖了三个关键部分：Java后端处理、jQuery（jq）前端交互以及Jcrop图像裁剪库的使用。下面将详细解释这三个方面的知识点。 首先，让我们来看看前端部分。jQuery（jq）是...
**正文** ...前端利用Jcrop实现交互式选取，后端用Java处理裁剪逻辑。通过这种方式，我们可以创建一个完整的图片裁剪服务，满足用户自定义裁剪需求，同时利用后端的强大处理能力确保裁剪的精度和效率。
Jcrop是一款广泛应用于网页开发中的JavaScript图像裁剪库，它允许用户在网页上交互式地选取图像的矩形区域，通常用于实现头像上传、图片预览或自定义尺寸截图等功能。这款工具的核心是其JavaScript代码，通过与HTML...
Jcrop是一款强大的JavaScript图片裁剪库，它允许用户在前端自由地选择和裁剪图片，广泛应用于网页中的图片预览、上传前的裁剪等场景。这款工具以其直观的用户界面和灵活的配置选项，深受开发者喜爱。 **一、Jcrop...
Jcrop 是一个基于 jQuery 的 JavaScript 图像裁剪插件，它允许用户在网页上选择并裁剪图像，常用于图片上传前的预览和编辑。这个插件为开发者提供了丰富的功能，包括动态调整选区、比例锁定、多边形裁剪等，极大地...
在IT行业中，图片处理是一项常见的需求，特别是在网页和应用程序中，用户可能需要上传并裁剪图片以满足特定的尺寸或比例。Jcrop是一款强大的JavaScript库，专门用于图像选择和裁剪，它允许用户通过浏览器直接操作...