javascript 中是否有一种方法可以检查鼠标位置当前是否位于元素的边界内?
是否有您可以推荐的功能或快速的方法?
if ( document.mouse.x > ele.offsetLeft && document.mouse.x < ele.offsetRight ...check y bounds)
{
return true;
}
else return false;
最佳答案
您可以存储边界坐标和鼠标坐标。这样您就可以随时查看。
var coords = [0,0];
$(document).mousemove(function(e){
var C = coords; // one global lookup
C[0] = e.pageX;
C[1] = e.pageY;
});
var box_area = {x1:0, y1:0, x2:0, y2:0};
var box = $('#box');
function store_boundary() {
var B = box, O = B.offset();
box_area = {
x1: O.left,
y1: O.top,
x2: O.left + B.width(),
y2: O.top + B.height()
};
}
store_boundary();
function is_mouse_in_area() {
var C = coords, B = box_area;
if (C[0] >= B.x1 && C[0] <= B.x2) {
if (C[1] >= B.y1 && C[1] <= B.y2) {
return true;
}
}
return false;
};
我想在没有 jQuery 的情况下给你一个答案,但我认为 .offset()(相对于文档的左/上坐标)确实做得很好并且经过了很好的测试。但是,您可以自己编写,总计 offsetLeft 和 offsetTop 到文档。就此而言,您还可以将 $.mousemove() 替换为:
document.addEventListener('mousemove',function(e){ ... },false);
最后一件事:如果你重排页面,你需要再次调用 store_boundary()。
关于javascript - 检查鼠标是否在元素的边界内,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7397356/