我正在使用jQuery UI对话框来加载ajax内容.它正确地垂直定位对话框,然而,宽度：“自动”选项它不会水平居中.它偏离中心,就像中心右侧100px一样.
这是我的代码：
- $('.open').live('click',function(e) {
- e.preventDefault();
- $("#modal").load($(this).attr('href')).dialog({
- title: $(this).attr('title'),modal: true,autoOpen: true,draggable: false,resizable: false,width: 'auto',position: ['center','top']
- });
- });
任何想法,如果有办法让它自动调整大小并保持中心？
编辑：这工作：
- $("#modal").load($(this).attr('href'),function() {
- $("#modal").dialog({
- title: $(this).attr('title'),150],create: function(event,ui) {}
- });
- });
解决方法
要避免定位问题,您应该在创建或打开对话框之前等待内容加载.除此以外：
> jQuery UI对话框将计算空div的宽度和中心
>当内容加载时,对话框的右侧会拉伸以容纳内容,而左侧保持固定,导致对话框显示向右移动
您的示例代码应更改为：
- $("#modal").load("/ajax/content.html",function() {
- // callback is executed after post-processing and HTML insertion has been performed
- // this refers to the element on which load method was called
- $(this).dialog({
- modal: true,width: "auto",position: { my: "top",at: "top",of: window }
- });
- });
