jquery - 将工具提示保留在父容器内

Question

我在 Web 应用程序中使用 jQuery UI 工具提示。默认情况下，工具提示的位置位于“工具提示元素”的左下角。但是，当工具提示不适合浏览器窗口时，它会切换到右下角。

这种行为很棒，但是我不想根据浏览器窗口的宽度确定工具提示位于右下角还是左下角，而是根据父容器的宽度来确定，以便工具提示不要在我确定的区域之外显示。

请注意，我知道如何使用 API 手动控制位置，我正在寻找方法来控制全局定位的逻辑。

$(function() {
    $( '#bodyInner' ).tooltip();
});

This is so far I have done.

Answer 1

您可以使用 position 实现与工具提示定位相关的任何内容。 jQuery UI 工具提示中的选项。 jQuery UI Position 选项包含许多其他选项，例如 my、at 等。此类选项为 within 。这可用于限制一个元素在另一个元素中的位置。

在这里，只需按如下方式初始化工具提示即可将工具提示位置包含在父元素内。

$( '#bodyInner' ).tooltip({
    position:{ within: "#bodyInner"}
});

这是Demo .