Jquery图像裁剪问题 - 显示图像的另一部分而不是选中

Question

我的插件存在问题

http://odyniec.net/projects/imgareaselect/

我认为图像描述了这一切。

我已选择整个图像，但拇指只显示其中的一部分。 即使在较大的图像上，它确实显得很糟糕。我的代码

function preview(img, selection) {
    if (!selection.width || !selection.height)
        return;
    var scaleX = 100 / selection.width;
    var scaleY = 100 / selection.height;

    $('#preview img').css({                          
        width: Math.round(scaleX * 300),             
        height: Math.round(scaleY * 300),
        marginLeft: -Math.round(scaleX * selection.x1),
        marginTop: -Math.round(scaleY * selection.y1)
    });                                              

}

$(function () {
    $('#photo').imgAreaSelect({ aspectRatio: '1:1', handles: true,
        fadeSpeed: 200, onSelectChange: preview });
});

我尝试了jcrop，但它做了同样的

Answer 1

您的预览似乎已关闭缩放功能。您的编辑区域和预览看起来都是相同的大小（~100px），但您的JavaScript设置为300px正方形的编辑区域和100px正方形的预览区域;这意味着您的预览比它应该的宽3倍，并且最终会有一个太大的预览，也会被裁剪。

Answer 2

值“100”是宽度和高度的预览图像，值“300”是宽度和高度的主要图像。