Jcrop quetscht Bild nach geladen, gilt falsche Breite

Question

Ich benutze Jcrop zum Bearbeiten von Bildern hochgeladen von Benutzern, wenn ein Benutzer beschließt, ihr Bild zu bearbeiten, ein AJAX-Aufruf wird gemacht, um das Originalbild des Benutzers zu erhalten, ist mein Code wie folgt:

var jcrop_api; 

$('.edit_image').on('click', function(e) 
{ 
    var url = $(this).attr('data-url'); 

    e.preventDefault(); 

    $.ajax({ 
    url: url, 
    type: 'GET', 
    cache: false, 
    beforeSend: function() 
    { 
     // Remove old box in case user uploaded new image bring the latest one 
     $('#edit_box').remove(); 
    }, 
    success: function(result) 
    { 
     if (result.error) 
     { 
     alert(result.error); 
     } 
     else 
     { 

     $('.edit_image_box').html(result); 
     $('#edit_box').modal({ show: true}); 

     $('#original_img').load(function() 
     { 
      $(this).Jcrop({ 
      aspectRatio: 1, 
      onSelect: updateCoords, 
      boxWidth: 700, 
      boxHeight: 700 
      }, function() 
      { 
      jcrop_api = this; 
      }); 
     }); 
     } 
    } 
    }) 
}); 

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; 
}; 

die Box geladen wird, wird die modal angezeigt und das Bild wird perfekt geladen, aber sobald es fertig Laden und Jcrop kommt es zu spielen, die Breite vollständig schrumpft, um ein Bild von etwa 20px breit zu verlassen.

Kann mir bitte jemand helfen, fast 80% der Fälle. Prost!

Answer 1

neugierig, haben Sie versucht:

function updateCoords(c) 
{ 
    $('#x').val(c.x); 
    $('#y').val(c.y); 
    $('#w').val(c.x2); 
    $('#h').val(c.y2); 
}; 

Answer 2

ich die Lösung gefunden, ist das Problem mit der feinfühligen Gitter mit, ich bin Twitters Bootstrap modal mit dem Bildbeschneidungs ​​anzuzeigen, und die CSS für die Körper ist auf maximale Breite eingestellt: 100%; Diese Einstellung verwechselt JCrop, wenn die Breite und Höhe des Bildes ermittelt werden. Daher zu lösen benötigt dies das einzige ist, das Bild in einem DIV mit Klasse .jcrop oder alles, was Sie bevorzugen und setzen die CSS wickeln:

.jcrop img { 
    max-width: none; 
} 

dies löst das Problem, jetzt, wenn jemand weiß, wie man drehen Jcop reagiert ich würde die Hilfe sehr schätzen. Hier ist eine detailliertere Diskussion github pull

Prost!