jQuery UI按比例调整子元素的大小

我正在寻找一种按比例缩放子元素的方法。为了更好地理解，请访问

这是我的代码

$(function() {
    $( "#resizable" ).resizable({
        alsoResize: ".also"
    });
    $( ".also" ).resizable().draggable();
});

或

http://jsfiddle.net/dF7WV/

这是我不工作的版本。有什么想法吗？我如何用jQueryui更好地实现这一点？

编辑：我现在领先一步。这是一个近乎完美的版本。init状态运行得很好，但当我移动一个子项时，它在缩放父项elem:时会丢失positin

http://jsfiddle.net/NNLg9/

<script>
$(function() {
    $( "#resizable" ).resizable({
        alsoResize: ".also"
    });
    $( ".also" ).resizable({
        alsoResize:"#resizable",
         containment:"#resizable"
    }).draggable({
        containment:"parent",
    });
});
</script>

$( "#resizable" ).resizable({
alsoResize: ".also",
aspectRatio: 5/1
});