我有一种情况，我想为工具提示提供一些上下文帮助...但是，我拥有的元素有时位于绝对定位元素的下方。
虽然我意识到这可能是不可能的，但我在想有没有办法询问顶层元素下面的元素？
我只是不确定如何做到这一点。我不介意使用 css 或 javascript，但任何正确方向的帮助将不胜感激。
请查看下方横条上方绝对定位的 div（带有红色涂鸦的灰色框）的图像。
请注意，绿色条是相对位置，而各个条也定位：绝对。
【问题讨论】：
标签： javascript jquery css
您必须检查每个子 div 内是否有鼠标点击；这是一个小提琴https://jsfiddle.net/6rx18d56/1。命中测试：
function inside(a, x, y) {
var l = a.offset().left;
var t = a.offset().top;
var r = l + a.outerWidth(true);
var b = t + a.outerHeight(true);
return l <= x && x <= r &&
t <= y && y <= b;
}
编辑：
是的，大声笑，我知道这即将到来。查看https://jsfiddle.net/6rx18d56/2/。我已经让它更通用了，希望你的图表中有一些 ID 和类名的基本原理。无论如何，命中测试是一样的，我们只是用 jQuery 循环遍历元素，跟踪原始叠加层以及是否已经发生命中：
$(".foo").on("mousemove", function(e) {
var hit = false;
var self = $(this);
$(".x, .y").each(function(ignore, d) {
if (!hit) {
if (inside($(d), e.pageX, e.pageY)) {
self.attr("title", $(d).attr("title"));
hit = true;
}
else {
self.attr("title", "");
}
}
});
});
【讨论】：
你可以使用 jQuery 的位置，虽然它最终会相当冗长：
var pos = $("myDiv").position();
然后通过以下方式确定位置：
console.log(pos.left, pos.top, pos.right, pos.bottom)
阅读此处了解更多信息：
https://api.jquery.com/position/
然后您可以检查.mousemove 是否在 div 的范围内。在这里阅读：
https://api.jquery.com/mousemove/
但是，这很有可能对于普通用户来说太复杂了。
【讨论】：