jQuery( document ).ready(function($) {
$('.dg-sel-fac').hide();
if( $('div').is('#dg-content')) {
$('#for-crop').load(function(){
startCrop(size_ratio);
sizeOnS();
});
}
function startCrop(noAS){
jcrop_api = $.Jcrop('#for-crop');
console.log('x1='+$('#x1').val());
console.log('x2='+$('#x2').val());
console.log('root_width='+root_width);
console.log('root_height='+root_height);
jcrop_api.setOptions({setSelect: [ $('#x1').val(), $('#y1').val(), root_width, root_height ]});
jcrop_api.setOptions({
onChange: showCoords,
onSelect: showCoords,
bgColor: 'black',
bgOpacity: .4,
allowSelect:false
});
}
});
<div class="dg-crop-step1">
<img id="for-crop" alt="" src="<?= $img[0] ?>">
</div>