jQuery:如何检查元素是否超出浏览器窗口的大小,以及如何重新定位它

Question

我有这个代码:

var pos = $(this).offset();
var width = $(this).width();

userPreviewCon.css({
     left: (pos.left + 30) + 'px',
     top: (pos.top + 15) + 'px'
}).fadeIn();

...用于相对于鼠标指向的元素定位弹出窗口.

但是当一个元素靠近窗口的边框时,某些工具提示是不可见的,因为它的一部分超出了窗口大小.问题是:如何重新定位工具提示不再超出窗口的边框？

Answer 1

要获得窗口的宽度,您可以这样做

$(window).width();

然后检查并查看这是否与您想要的一侧(从您发布的内容看起来,进行此评估)

(pos.left + 30) > $(window).width();

最后,如果此评估为真,您可以执行以下操作

pos.left -= pos.left + 30 - $(window).width();

这应该使你的工具提示框弹出,使其右边缘在窗口的右边缘.