javascript - jQuery检测父元素边缘的最佳方法

Question

我在一个框架内开发了一个小弹出框元素，目的是让这个框架位于一个 facebook 应用程序中。这意味着该应用程序被限制为 810 像素，并且不会出现出血。在我的应用程序中，您可以悬停一个元素，该元素将创建一个带有稍大元素的小弹出框，并在其中发出号召性用语。

然而，这不起作用，因为出血会切断图像。所以我正在玩弄检测父边缘并在应用程序窗口中偏移或居中弹出框的想法。你认为会是：

a) 最好的选择 b) 最快的选择 c) 为什么

真的很感谢对此的一些意见。

Answer 1

$(elem).position()

检测左上角元素的位置。要获得右下角，您可以使用

$(elem).width()
$(elem).height()

返回元素的大小，以便您可以计算底部和右侧位置。

我会创建一个 ui 函数，它将一次返回所有 4 个值

function get_position(e) {
    var res = new Object();
    var pos = e.position();
    res.left = pos.left;
    res.top = post.top;
    res.right = res.left + e.width();
    res.bottom = res.top + e.height();
    return res;
}

并为父元素调用它get_position($('#id').parent())

请注意，如果您使用边距、内边距和边框，这些值可能会出乎意料。在这种情况下，您可以使用outerWidth()jquery 函数。