Div interno dentro de uma div girada externa não segue o mouse no caso de arrastar com jQuery UI

Eu tenho uma div interna dentro de uma div externa. O div interno é arrastável e o exterior é girado em 40 graus. Este é um caso de teste. Em um caso real, poderia ser qualquer ângulo. Existe outro ponto chamado div que é posicionado como mostrado na figura. (Sou de um fundo flash. No Flash, se eu fosse arrastar o div interno, ele seguiria o mouse, mesmo se contivesse dentro de um div girado para o exterior.) Mas em HTML, o div interno não segue o mouse como pode ser visto do violino. Eu quero que o div 'ponto' siga exatamente o mouse. Isso é possível. Eu tentei trabalhá-lo usando trignometria, mas não consegui fazê-lo funcionar.

http://jsfiddle.net/bobbyfrancisjoseph/kB4ra/8/

questionAnswers(6)

yourAnswerToTheQuestion