Javascript JCrop大图像问题
是否可以设置一些maxWidth和maxHeight来裁剪大图像? 我在文档中找到了maxSize,但它仅适用于选择区域。我也试过trueSizeJavascript JCrop大图像问题,javascript,jquery,jcrop,Javascript,Jquery,Jcrop,是否可以设置一些maxWidth和maxHeight来裁剪大图像? 我在文档中找到了maxSize,但它仅适用于选择区域。我也试过trueSize function initJCrop(){ // Create variables (in this scope) to hold the API and image size var jcrop_api, boundx, boundy, // Grab some informatio
function initJCrop(){
// 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();
//console.log('init',[xsize,ysize]);
$('#imageEdit').Jcrop({
onChange: updatePreview,
onSelect: updatePreview,
aspectRatio: 220 / 55,
}, 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;
jcrop_api.animateTo([ 120,120,20,20 ]);
jcrop_api.trueSize([200, 100])
// Move the preview into the jcrop container for css positioning
$preview.appendTo(jcrop_api.ui.holder);
});
现在我的照片是这样的。它们超出了模态范围:
我找到了答案。
您应该使用boxHeight和boxWidth选项。
像这样:
$('#imageEdit').Jcrop({
onChange: updatePreview,
onSelect: updatePreview,
aspectRatio: 220 / 55,
boxWidth: 350
}, 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;
jcrop_api.animateTo([ 120,120,20,20 ]);
// jcrop_api.trueSize([200, 100])
// Move the preview into the jcrop container for css positioning
$preview.appendTo(jcrop_api.ui.holder);
});