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();

这应该使您的工具提示框弹出，使其右边缘位于窗口的右边缘。