需要解决jquery-ui/ webkit中的.position() bug

Question

我有一个网页，最终是一堆jquery-ui对话框，所有30%的屏幕宽度，在三列，每个包含不同类型的仪表板信息。

我将数据加载到div中，并在$(document).ready()函数上创建对话框，并根据div显示的数据类型将它们排列在不同列中。

我为每个div使用了该代码的变体(我计划在使其正常工作时使其更干净，因此请原谅它的冗余)。首先，我创建一个包含数据的对话框:

//show recent posts if they exist below the account requests
if($('#recentPosts').html().length > 0){
    $('#recentPosts')
    .dialog({
        title: 'Recent Forum Messages',
        height: 320
    })
    .parent().addClass('cfdialog').attr('id', 'recentPostsDialog');
} else {
    $('#recentPosts').addClass('cfdialog').attr('id', 'recentPostsDialog');
}

…这是必要的，因为我需要能够抓取整个对话框(我不明白为什么没有机制可以轻松地为对话框div分配ID);在创建了所有对话框之后，我做了这样的事情:

//now that the dialogs are set up, position them.
var leftContent = $('#columnTop');
var centerContent = $('#columnTop');
var rightContent = $('#columnTop');
$('.cfdialog')
.css('width', '30%')
.css('height', 'auto')
.css('max-height', '400');
...
$('#recentPostsDialog')
.position({
    my: 'center top',
    at: 'center bottom',
    of: centerContent,
    offset: '0 5'
});
if ($('#recentPostsDialog').html().length > 0){
    centerContent = $('#recentPostsDialog');
}

这将在一个对话框中显示帖子，就像我想在FireFox和IE中一样。然而，在Chrome浏览器中，对话框弹出约30像素，干扰了我的菜单项。

我在SO和jquery论坛上读过不少东西，建议这是由于webkit计算偏移量的方式，有人发布了补丁修复，但在这种情况下似乎不起作用。

有人能告诉我如何解决基于webkit的浏览器的问题吗?

Answer 1

这个问题似乎很难回答。我最终测试了jQuery.browser.safari，如果是真的，手动抵消了div。(