HippoDuck
HippoDuck

Reputation: 2194

Set aspect ratio of JCrop on button click?

I am using JCrop to allow users to crop images when uploading them.

There are two possible image crop sizes that are allowed, for example 16:10 or 4:3.

I would like to be able to add two input buttons, and have one of them set the aspect ratio as 16:10, and the other 4:3.

This is the code to set the aspect to 16:10 with the page load, Is it possible to have it change to 4:3 on button press?

<script language="Javascript">
    jQuery(function($) {
        $('#crop').Jcrop({
            aspectRatio: 16 / 10
        });
    });
</script>

Upvotes: 0

Views: 3874

Answers (1)

Groben
Groben

Reputation: 1386

You can use it like that :

jQuery(function($) {
    var jcrop_api;
    $('#crop').Jcrop({
        aspectRatio: 16 / 10
    }, function () {
        jcrop_api = this;    
    });
});

then on the click event :

jcrop_api.setOptions({ aspectRatio: 4 / 3 });
jcrop_api.focus();

Upvotes: 4

Related Questions