如何将鼠标位置转换为css 3d转换元素位置

Question

如JSFiddle所示，当您将鼠标移到3d转换后的div上时，我尝试将鼠标位置转换为css 3d转换后的元素空间。

这意味着，红点应始终显示在鼠标的确切位置。

但是，DIV html元素没有方法getScreenCTM或getTransformToElement或matrixTransform，可用于转换点。有人知道如何实现这个目标吗？

http://jsfiddle.net/9cv2y0dp/

var tel = $('#transformed')[0];
var box = $('#box')[0];
tel.style.transform 
    = 'translate3d(100px,100px,0px) rotateY(45deg)';
var rect = tel.getBoundingClientRect();
$('#transformed').bind('mousedown', function(e){
    var evt = e || event;
    var x = evt.clientX;
    var y = evt.clientY;
    $('#cursor')[0].style.left = (x - rect.left) + 'px';
    $('#cursor')[0].style.top = (y - rect.top) + 'px';
    box.innerHTML = (x - rect.left) + 'px<br/>' + (y - rect.top) + 'px';
});