JCrop으로 이미지 확대/축소

Question

Jcrop을 사용하여 이미지를 자릅니다. 큰 이미지가 브라우저 창을 넘치게하여 문제가 발생했습니다. 따라서 Jcrop's page에 대한 조언을 따르고 상자 크기 조정 방법을 사용하여 큰 이미지를 자르기 상자 내부에 맞도록 조정했습니다. 아래 예제 코드를 사용했지만 잘 작동하지만 문제는 브라우저에서 크기가 조정 된 이미지와 거대한 이미지가 모두있는 것입니다. 내 브라우저에 재조정 된 이미지 만 나타나게하고 싶습니다. 어떤 제안? 표시 방법은 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; 
} 

Answer 1

두 cropbox 함수를 병합하지 않으면 잘못되었습니다. 이 문제를 발견하고 수정했을 때 효과적이었습니다.

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