Javascript jCrop un约束比例
我已经在.NET MVC4中构建了一个图像上传和裁剪应用程序,并在deepliquid.com.Aas上找到了以下代码。作为一名MVC开发人员,我已经完成了这部分工作,但我的javascript还有很多需要改进的地方。下面的代码约束比例,我如何更新它,使其不约束比例,但仍保留预览Javascript jCrop un约束比例,javascript,asp.net-mvc-4,jcrop,Javascript,Asp.net Mvc 4,Jcrop,我已经在.NET MVC4中构建了一个图像上传和裁剪应用程序,并在deepliquid.com.Aas上找到了以下代码。作为一名MVC开发人员,我已经完成了这部分工作,但我的javascript还有很多需要改进的地方。下面的代码约束比例,我如何更新它,使其不约束比例,但仍保留预览 <script type="text/javascript"> jQuery(function ($) {
<script type="text/javascript">
jQuery(function ($) {
// Create variables (in this scope) to hold the API and image size
var jcrop_api,
boundx,
boundy,
// Grab some information about the preview pane
$preview = $('#preview-pane'),
$pcnt = $('#preview-pane .preview-container'),
$pimg = $('#preview-pane .preview-container img'),
xsize = $pcnt.width(),
ysize = $pcnt.height();
$('#target').Jcrop({
onChange: updatePreview,
onSelect: updatePreview,
**aspectRatio: xsize / ysize**
}, function () {
// Use the API to get the real image size
var bounds = this.getBounds();
boundx = bounds[0];
boundy = bounds[1];
// Store the API in the jcrop_api variable
jcrop_api = this;
// Move the preview into the jcrop container for css positioning
$preview.appendTo(jcrop_api.ui.holder);
});
function updatePreview(c) {
if (parseInt(c.w) > 0) {
var rx = xsize / c.w;
var ry = ysize / c.h;
$pimg.css({
width: Math.round(rx * boundx) + 'px',
height: Math.round(ry * boundy) + 'px',
marginLeft: '-' + Math.round(rx * c.x) + 'px',
marginTop: '-' + Math.round(ry * c.y) + 'px'
});
}
};
});
</script>
jQuery(函数($){
//创建变量(在此范围内)以保存API和图像大小
var jcrop_api,
庞德,
庞迪,
//获取有关预览窗格的一些信息
$preview=$(“#预览窗格”),
$pcnt=$(“#预览窗格.预览容器”),
$pimg=$(“#预览窗格.预览容器img”),
xsize=$pcnt.width(),
ysize=$pcnt.height();
$('#target').Jcrop({
onChange:updatePreview,
onSelect:updatePreview,
**aspectRatio:xsize/ysize**
},函数(){
//使用API获得真实的图像大小
var bounds=this.getBounds();
boundx=边界[0];
boundy=边界[1];
//将API存储在jcrop_API变量中
jcrop_api=这个;
//将预览移动到jcrop容器中以进行css定位
$preview.appendTo(jcrop_api.ui.holder);
});
函数updatePreview(c){
如果(parseInt(c.w)>0){
var rx=xsize/c.w;
var ry=ysize/c.h;
$pimg.css({
宽度:数学圆(rx*boundx)+“px”,
高度:数学圆(ry*boundy)+“px”,
marginLeft:“-”+数学四舍五入(rx*c.x)+“px”,
marginTop:“-”+数学圆(ry*c.y)+“px”
});
}
};
});
明白了,只需删除
aspectRatio: xsize / ysize