Проблема обрезки изображения 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

Похоже, ваше масштабирование отключено для вашего предварительного просмотра.Ваша область редактирования и предварительный просмотр выглядят одинакового размера (~ 100 пикселей), но ваш JavaScript настроен на область редактирования площадью 300 пикселей и область предварительного просмотра площадью 100 пикселей;это означает, что ваш предварительный просмотр получается в 3 раза шире, чем должен быть, и в результате вы получаете слишком большой предварительный просмотр, который также обрезается.

Answer 2

Значение «100» - это предварительное изображение ширины и высоты, а значение «300» - это основное изображение ширины и высоты.