javascript - 获取鼠标相对于缩小的div的位置

我要完成的工作是通过矩阵变换获取鼠标相对于缩小div的位置。正如您将在下面的小提琴中看到的那样，我有一个宽度为4000px的红色div，但是由于它已缩小，因此看起来较小，然后说4000px。如果单击红色div中的相交线，将会发生什么情况，relX应该读为（大约）2000，而relY应该读为325。

$(".crazyWide").click(function(e){
    var clickPos = $(this).offset();
    var relX = e.pageX - clickPos.left;
    var relY = e.pageY - clickPos.top;

    //Used to display current click coords
    $(".debug").empty();
    $(".debug").prepend("relX: " + relX + " relY: " + relY);
});

Fiddle

最佳答案

该元素在两个方向上均缩小为0.12倍。这样，您可以通过将relX和relY除以0.12来计算鼠标的相对单击位置：

$(".debug").prepend("relX: " + (relX / 0.12) + " relY: " + (relY / 0.12));

Updated fiddle