Javascript 如何将弹出div居中放置在鼠标光标下方，但将其完全保留在窗口内？

我试图在鼠标光标下方显示一个弹出div，但它应该完全位于可见区域内。在鼠标光标下方显示div：

var popupHeight = $("#popup").height();
var popupWidth = $("#popup").width();
$("#popup").css({
    "position" : "absolute",
    "top" : lastClickPosition.pageY - (popupHeight/2),
    "left" : lastClickPosition.pageX - (popupWidth/2))
});

这种简单方法的问题在于，弹出div可能部分位于屏幕之外。因此，我试图计算它在屏幕内的最小和最大偏移量：

Math.min(Math.max(0, lastClickPosition.pageY - (popupHeight/2)), 
         windowHeight - popupHeight - 20)+"px"

但这种方法在页面向下滚动后失败，因为pageX/Y是相对于页面的，不可见部分

---

还有其他想法吗？

您需要在

窗口的
滚动条中添加。看

垂直滚动位置为
与所显示的像素数相同
隐藏在可滚动屏幕上方的视图中
地区如果滚动条位于最右侧
顶部，或者如果元素不是
可滚动，此数字将为0

@欢迎光临！很乐意帮忙。
$(window).scrollTop(); // this is the scroll distance from the top