jQuery resizable - alsoresize rect in svg through outer div control

jQuery resizable - alsoresize rect in svg through outer div control

HTML:

<svg width="400" height="110" style="background:red"> <rect id="rectangle" width="300" height="100" style="fill:rgb(0,0,255);stroke-width:3;stroke:rgb(0,0,0)" /> </svg> <div id="firstDiv" style="width:100px;height:100px; background:green"> </div>

jQuery:

 jQuery('#firstDiv').resizable({ handles: 'se', animate: true, alsoResize: '#rectangle', })

With this sample, The rect inside svg always starting from x=0, y=0 when we resize firstDiv.

Rect has to start from where it was its last starting/ending position not from zero