0

我正在使用带有 jQ​​uery UI 的选项卡式界面。那工作正常。每个选项卡实际上是一个表单。因此，当提交该表单时，该操作会将用户带回同一页面。但那时我想打开适当的标签。

所以，我正在使用一个看起来像这样的 URL。

domain.com/page.php#tab1

哪个工作正常并打开正确的选项卡。页面的滚动位置有一个小问题。这是由于页面上的锚点位置。我希望滚动条位于页面顶部，所以我使用类似这样的东西回到顶部。

$('html, body').animate({ scrollTop: 0 });

所以，一切都很好。但是，然后我打开一个模式对话框，由于发生了滚动，它的位置不正确。

我已经进行了研究，并发现了重新定位模态的建议：

$('my-selector').dialog('option', 'position', 'center');

但这似乎不起作用。

那么我怎样才能让这个玩得很好呢？

我的简化代码如下：

html

<div id="tester">
</div>

脚本 - 准备好文档

$('html, body').animate({ scrollTop: 0 });#

jQuery('#tester').dialog
({
title: "Attribute " ,
minWidth: 840,
height:500
});

实际上，在真实版本中，对话框是通过点击处理程序打开的。因此，在打开对话框时，动画绝对是完整的。所以我对为什么模式出现在页面底部感到困惑。

提前致谢

4

1 回答 1

0

如果您确保在.animate()方法的完整回调上打开对话框，您应该没有任何问题。

可能发生的情况是，在打开对话框时动画仍处于过渡状态，因此对其位置的内部计算不正确。下面是一个基本示例：

$('#button').click(function () {
    $('html, body').animate({
        scrollTop: 0
    }, openDialog);
});

function openDialog() {
    jQuery('#tester').dialog({
        title: "Attribute ",
        minWidth: 840,
        height: 500
    });
}

jsfiddle

于 2013-02-20T21:47:42.097 回答