jQuery 获取元素内的鼠标位置

我希望制作一个控件，用户可以在 div 内单击，然后拖动鼠标，然后松开鼠标以指示他们想要的内容有多长。 （这是针对日历控件的，因此用户将指示特定事件的时间长度）

看起来最好的方法是在父 div 上注册一个“mousedown”事件，而父 div 又在 div 上注册一个“mousemove”事件，直到触发“mouseup”事件。 “mousedown”和“mouseup”事件将定义时间范围的开始和结束，当我跟踪“mousemove”事件时，我可以动态更改范围的大小，以便用户可以看到他们在做什么。我基于谷歌日历中事件的创建方式。

我遇到的问题是 jQuery 事件似乎只提供参考整个页面的可靠鼠标坐标信息。有什么方法可以辨别相对于父元素的坐标吗？

Edit:

Heres a picture of what I'm trying to do:

一种方法是使用 jQueryoffset http://api.jquery.com/offset/方法来翻译event.pageX http://api.jquery.com/event.pageX/ and event.pageY http://api.jquery.com/event.pageX/从事件到相对于父级的鼠标位置的坐标。这是一个供将来参考的示例：

$("#something").click(function(e){
   var parentOffset = $(this).parent().offset(); 
   //or $(this).offset(); if you really just want the current element's offset
   var relX = e.pageX - parentOffset.left;
   var relY = e.pageY - parentOffset.top;
});