使用 JCrop 重新缩放大图像

Posted 2023-02-25

【中文标题】使用 JCrop 重新缩放大图像

【英文标题】：Rescale Large Images with JCrop

【发布时间】：2013-05-01 23:01:15

【问题描述】：

我正在使用 Jcrop 裁剪图像。我的浏览器窗口溢出大图像时遇到问题，因此我遵循Jcrop's page 上的建议并使用 Box Sizing Method 缩放大图像以适合裁剪框。我使用了示例代码（如下），它运行良好，但问题是我现在在浏览器中同时拥有缩放图像和巨大图像。我只想让重新缩放的图像出现在我的浏览器中。有什么建议么？这是example 的显示方式。

$(function()   
    $('#cropbox').Jcrop( 
        boxWidth: 700, boxHeight: 700
    ); 
);

$(function()
    $('#cropbox').Jcrop(    
        aspectRatio: 1,
        onSelect: updateCoords
    );
);

function updateCoords(c) 
    $('#x').val(c.x);
    $('#y').val(c.y);
    $('#w').val(c.w);
    $('#h').val(c.h);
;

function checkCoords() 
    if (parseInt($('#w').val())) return true;
    alert('Please select a crop region then press submit.');
    return false;

【参考方案1】：

我没有将两个裁剪框功能合并在一起，这出了问题。当我发现并修改它时，效果很好：

$(function()   
    $('#cropbox').Jcrop(
        boxWidth: 600,
        boxHeight: 600,
        aspectRatio: 1,
    onSelect: updateCoords
 );    
);