JCrop 没有按预期裁剪图像
JCrop not cropping image as intended
允许用户在我的网站上传图片。我正在根据图像的高度和宽度调整图像大小,这是我的 JQuery(imgSize
是高度,imgSize2
是宽度):
...
...
if (imgSize > 252 && imgSize2 <= 320) {
var imgwidth = $("#previewSub2").width();
var imgheight = $("#previewSub2").height();
$("#previewSub").css("height", "220px");
$("#previewSub").css("width", "auto");
$("#previewSub").Jcrop({
onChange: showPreview,
onSelect: showPreview,
aspectRatio: 1,
setSelect: [0,imgwidth+100,0,0],
minSize: [90,90],
addClass: 'jcrop-light'
});
}
注意我已经更改了 img 的高度和宽度 #previewSub
。现在这是我的 JCrop 代码的其余部分:
function showPreview(coords)
{
$('#x').val(coords.x);
$('#y').val(coords.y);
$('#w').val(coords.w);
$('#h').val(coords.h);
var rx = 150 / coords.w;
var ry = 150 / coords.h;
var imgSize = $("#previewSub").height();
var imgWidth = $("#previewSub").width();
$('#previewSub2').css({
width: Math.round(rx * imgWidth) + 'px',
height: Math.round(ry * imgSize) + 'px',
marginLeft: '-' + Math.round(rx * coords.x) + 'px',
marginTop: '-' + Math.round(ry * coords.y) + 'px'
});
}
当我使用php 捕获新裁剪的图像时,裁剪被关闭。它的收获比它应该的多得多。有什么办法可以规避这个问题?问题是因为我正在调整 img #previewSub
的大小吗?
您应该将真实尺寸添加到 Jcrop
设置中:
trueSize: [imgwidth, imgheight],
允许用户在我的网站上传图片。我正在根据图像的高度和宽度调整图像大小,这是我的 JQuery(imgSize
是高度,imgSize2
是宽度):
...
...
if (imgSize > 252 && imgSize2 <= 320) {
var imgwidth = $("#previewSub2").width();
var imgheight = $("#previewSub2").height();
$("#previewSub").css("height", "220px");
$("#previewSub").css("width", "auto");
$("#previewSub").Jcrop({
onChange: showPreview,
onSelect: showPreview,
aspectRatio: 1,
setSelect: [0,imgwidth+100,0,0],
minSize: [90,90],
addClass: 'jcrop-light'
});
}
注意我已经更改了 img 的高度和宽度 #previewSub
。现在这是我的 JCrop 代码的其余部分:
function showPreview(coords)
{
$('#x').val(coords.x);
$('#y').val(coords.y);
$('#w').val(coords.w);
$('#h').val(coords.h);
var rx = 150 / coords.w;
var ry = 150 / coords.h;
var imgSize = $("#previewSub").height();
var imgWidth = $("#previewSub").width();
$('#previewSub2').css({
width: Math.round(rx * imgWidth) + 'px',
height: Math.round(ry * imgSize) + 'px',
marginLeft: '-' + Math.round(rx * coords.x) + 'px',
marginTop: '-' + Math.round(ry * coords.y) + 'px'
});
}
当我使用php 捕获新裁剪的图像时,裁剪被关闭。它的收获比它应该的多得多。有什么办法可以规避这个问题?问题是因为我正在调整 img #previewSub
的大小吗?
您应该将真实尺寸添加到 Jcrop
设置中:
trueSize: [imgwidth, imgheight],