jQuery resize on both sides

Question

I'll try to make it clear with words : I would like to know if there is a way with jquery-ui-resizable to resize an object on the 4 sides at the same time, so that the center of the object stay at the same position.

Here is the sandbox http://jsfiddle.net/V79Ge/

So, it's quite like the aspectRatio=true, but while I resize the object from one side, it would control the 3 other sides

Thank you for your clues!

Answer 1

Is this the effect you're after: jsFiddle example.

jQuery:

$('#resizeMe').resizable({
    aspectRatio: true,
    resize: function(event, ui) {
        $(this).css({
            'top': parseInt(ui.position.top, 10) + ((ui.originalSize.height - ui.size.height)) / 2,
            'left': parseInt(ui.position.left, 10) + ((ui.originalSize.width - ui.size.width)) / 2
        });
    }
});

Edit: updated code and jsFiddle to use ui.position and ui.originalSize.