Jcrop - 画像の一部を切り抜きができるjQueryプラグイン

<img src="demos/demofiles/flowers.jpg" id="jcroptarget" />


<div style="width:100px;height:100px;overflow:hidden;margin-left:5px;">
    <img src="demos/demo_files/flowers.jpg" id="preview" />
</div>

$(function(){


    $('#jcrop_target').Jcrop({
        onChange: showPreview,
        onSelect: showPreview,
        aspectRatio: 1
    });

});

function showPreview(coords)
{
    var rx = 100 / coords.w;
    var ry = 100 / coords.h;

    $('#preview').css({
        width: Math.round(rx * 500) + 'px',
        height: Math.round(ry * 370) + 'px',
        marginLeft: '-' + Math.round(rx * coords.x) + 'px',
        marginTop: '-' + Math.round(ry * coords.y) + 'px'
    });
};