jQuery - перетаскиваемый div с масштабированием

Это мой код:

http://jsfiddle.net/652nk/

HTML

CSS

#canvas {
    width:500px;
    height:250px;
    border:1px solid #444;
    zoom:0.7;
}
#dragme {
    width:100px;
    height:50px;
    background:#f30;
}

JS

$(function(){
    $('#dragme').draggable({containment:'parent'})
})

У меня серьезная проблема при использовании css zoom свойство. Положение целевого перетаскиваемого div не согласовано с положением курсора.

Есть какое-нибудь чистое и простое решение? Я должен иметь возможность динамически изменять масштаб.