Question

我正在使用Jcrop裁剪上传的图片。裁剪是方形图像，但上传的图像可以是任何方向。我遇到的问题是预览窗格。该公司工作得很好。

因此，当我设置裁剪区域时，预览图像会移动很多。当我靠近主图像的底部进行裁剪时，预览会变黑，但如果我在主图像的顶部附近进行裁剪，则部分预览然后完全填充。我认为我对如何设置比率有疑问或解释。

这是我的预览代码：

function showUpdateCoords(c){
jQuery('form#crop-coords-form #x1').val(c.x);
jQuery('form#crop-coords-form #y1').val(c.y);
jQuery('form#crop-coords-form #x2').val(c.x2);
jQuery('form#crop-coords-form #y2').val(c.y2);
jQuery('form#crop-coords-form #w').val(c.w);
jQuery('form#crop-coords-form #h').val(c.h);

var img_h = jQuery('.jcrop-holder img').attr('height');//main image height
var img_w = jQuery('.jcrop-holder img').attr('width');//main image width
var ratio_x = 100 / c.w;
var ratio_y = 100 / c.h;

if( parseInt(c.w) > 0 ){
    $('#jcrop-preview-target').css({
        width: Math.round(ratio_x * img_w) + 'px', 
        height: Math.round(ratio_y * img_h) + 'px', 
        marginLeft: '-' + Math.round(ratio_x * c.x) + 'px',
        marginTop: '-' + Math.round(ratio_y * c.y) + 'px'
    });
}
}//end showUpdateCoords

非常感谢任何帮助！

使用jcrop图像预览时与上传的图像不同

0 个答案: