jQuery UI 对话框定位 [英] jQuery UI dialog positioning

问题描述

我正在尝试使用 jQuery 对话框 UI 库，以便在旁边放置一个对话框将鼠标悬停在上面时的一些文本.jQuery 对话框采用从当前视口左上角测量的位置参数(换句话说， [0, 0] 将始终将其放在浏览器窗口的左上角，无论您当前滚动到何处).但是，我知道检索位置的唯一方法是元素相对于整个页面的位置.

I am trying to use the jQuery dialog UI library in order to position a dialog next to some text when it is hovered over. The jQuery dialog takes a position parameter which is measured from the top left corner of the current viewport (in other words, [0, 0] will always put it in the upper left hand corner of your browser window, regardless of where you are currently scrolled to). However, the only way I know to retrieve the location is of the element relative to the ENTIRE page.

以下是我目前所拥有的.position.top 被计算为大约 1200 左右，这使得对话框远远低于页面上的其余内容.

The following is what I have currently. position.top is calculated to be something like 1200 or so, which puts the dialog well below the rest of the content on the page.

$(".mytext").mouseover(function() {
    position = $(this).position();
    $("#dialog").dialog('option', 'position', [position.top, position.left]);
}

如何找到正确的位置?

谢谢！

推荐答案

查看一些 jQuery 插件以实现对话框的其他实现.Cluetip 似乎是一个功能丰富的工具提示/对话框风格的插件.第 4 个演示听起来与您正在尝试做的类似(尽管我发现它没有您正在寻找的精确定位选项.)

Check out some of the jQuery plugins for other implementations of a dialog. Cluetip appears to be a feature-rich tooltip/dialog style plug-in. The 4th demo sounds similar to what you are trying to do (although I see that it doesn't have the precise positioning option that you're looking for.)

这篇关于jQuery UI 对话框定位的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！