带有标签的jQuery UI对话框

我正在使用带有jQuery UI的选项卡式界面。这工作正常。每个选项卡实际上是一个表单。所以当这个表单被提交时，这个动作会把用户带回到同一个页面。但在那一点上，我想打开适当的标签。带有标签的jQuery 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 
});

其实在现实版的对话框中显示有一个单击处理。所以，当对话框打开时，动画就完成了。所以我很困惑为什么模态出现在页面的底部。

在此先感谢

来源

2013-02-20 niccol

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

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

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

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

jsfiddle

来源

2013-02-20 21:47:42

@鲁本的感谢。好吧，那就是我认为的问题。但事实上并非如此。正如我所说的，即使通过点击事件打开对话框（动画发生很长时间后），效果仍然是一样的。该对话框在屏幕底部打开。 – niccol 2013-02-21 10:05:37

@niccol我认为你最好的选择是发布你的实际代码或使用jsfiddle构建问题的一个例子。否则，很难找出错误。 – 2013-02-21 10:28:45

带有标签的jQuery UI对话框

回答

相关问题