javascript - 网页边界值

Question

我有一个“框”弹出窗口，当鼠标悬停在某些链接上时会出现。该框高约 300px，框的顶部与链接位置在同一水平面上，但是其中一些链接位于页面的最低可滚动部分，因此弹出窗口将被 chop 。

问题哪些值用于检测页面底部，或到底部的剩余可滚动距离，以便您可以根据需要移动弹出窗口？

我正在使用 jQuery，但也欢迎引用通用的 JavaScript 解决方案。

谢谢。

Answer 1

基本上你想找到相对于文档的视口(viewport)底部，然后将它们与传入的坐标进行比较 event .

function handler(event) {
    var bottomOfViewport = $(window).scrollTop() + $(window).height();
    var bottomOfBox = event.pageY + HEIGHT_OF_BOX;
    if ( bottomOfViewport < bottomOfBox )
        // code to handle overflow condition
}

谢天谢地，pageX 和 pageY 属性是相对于文档的。 x 轴的情况类似。