Jquery当鼠标离元素x距离时如何触发函数?

时间:2013-04-16 18:11:41

标签: javascript jquery mouseevent mousemove

我希望当鼠标距离元素X距离时运行一个函数。

我认为应该移动mousemove事件,但由于元素可能并不总是在同一个地方,我不知道如何获得相对于元素的鼠标位置?

有没有人有类似的例子?

2 个答案:

答案 0 :(得分:2)

var mX, mY, distance;
$element  = $('#YourElementID');

    function calculateDistance(elem, mouseX, mouseY) {
        return Math.floor(Math.sqrt(Math.pow(mouseX - (elem.offset().left+(elem.width()/2)), 2) + Math.pow(mouseY - (elem.offset().top+(elem.height()/2)), 2)));
    }

    $(document).mousemove(function(e) {  
        mX = e.pageX;
        mY = e.pageY;
        distance = calculateDistance($element, mX, mY);
        // do your stuff with distance

    });

答案 1 :(得分:0)

您需要绑定到mousemove事件,将元素角的坐标存储在全局变量中,并继续检查鼠标移动的每个像素,直到当前鼠标位置和对象坐标之间的向量为长度X.那将是触发您将某个函数绑定到的自定义事件的时刻。

我不知道已经执行此操作的插件,因此请务必发布您在此处编写的插件的链接。 :)