如何使用 jQuery 来确定 div 何时不在右侧视图中？

Question

我有一个 div，当它聚焦时会显示在控件附近。最初，div 位于控件的左侧，生活很简单。一个简单的 if left < 0 { 左 = 0; } 会将 div 保留在屏幕上。现在 div 需要位于右侧，但我无法找出类似的代码。此外，代码不仅需要确定它是否在屏幕右侧，还需要确定它是否超出了（可能的）可滚动包含 div 的可见性。我怎样才能做到这一点？假设可以使用 $('.PanelScroll') 找到可滚动的 div（如果适用），我们可以调用需要放置的 div elem。

Answer 1

这是我一直在寻找的更简单的解决方案：

var ctrl = $('#<your control id>');         // This is the control that the div is display to the right of.
var elem = $('#<your element id>');         // This is the div that may be out of view.
var panel = $('#<your scrollable div id>');
var left = elem.position().left;
var right = left + elem.outerWidth();

if ((panel.length && (right > panel.innerWidth())) || (right > ($(window).width() + $(window).scrollLeft()))) {
    left = left - ctrl.outerWidth() - elem.outerWidth();
}

if (panel.length) {
    left += panel.scrollLeft();
}

elem.css('left', left);