jQuery UI对话框定位始终在右上角 [英] jQuery UI dialog positioning always on top right

问题描述

我已经在 jQuery UI对话框定位，似乎也不起作用。

  function openDialog（row_index）{
 var target = $（'＃note'+ row_index）; 
 $（＃dialog_content _+ row_index）.dialog（{width：150}，
 {height：80}）对话框（'widget'）position（{
 my： left'，
 at：'right'，
 of：target 
}）; 
} 
  

而这个HTML

 < a id =note10onclick =openDialog（'10'）style =cursor：pointer> 0010< / a> 
 
< div style =display：nonetitle =Title 10id =dialog_content_10>行10< / div> 
  

解决方案

将顶级名称添加到我的属性中工作 - 假设您要对齐锚点的顶部和右侧（在Chrome 11.0.6和IE9中测试）：

  function openDialog（row_index）{
 var target = $（'＃note'+ row_index）; 
 $（＃dialog_content _+ row_index）.dialog（{width：150}，
 {height：80}）对话框（'widget'）position（{
 my：左上角'，
位于：'右上角'，
为：target 
}）; 
} 
  

这里是 jQuery页面来测试不同的位置。

编辑：

这里是一个小提琴，显示它在右边对齐...也许问题是你的CSS或HTML中的其他地方？像小提琴一样，我一直在使用jQuery 1.5.1，jQuery UI 1.8.9和基础主题CSS文件进行测试。

I am trying to position dialog on the right of the anchor tag, but with no luck.

I checked the solutions at jQuery UI dialog positioning and neither seems to work.

function openDialog(row_index) {
   var target = $('#note'+row_index);
    $("#dialog_content_"+row_index).dialog({ width:150 },
                                        { height:80 }).dialog('widget').position({
                                                                      my: 'left',
                                                                      at: 'right',
                                                                      of: target
                                                                     });
}

And this HTML

<a id="note10" onclick="openDialog('10')" style="cursor:pointer">0010</a>

<div style="display:none" title="Title 10" id="dialog_content_10">Row 10</div>

解决方案

Adding the top designation to the my and at attributes seems to work - assuming you meant to align to the top and to the right of the anchor (tested in Chrome 11.0.6 and IE9):

function openDialog(row_index) {
   var target = $('#note'+row_index);
    $("#dialog_content_"+row_index).dialog({ width:150 },
                                        { height:80 }).dialog('widget').position({
                                                                      my: 'left top',
                                                                      at: 'right top',
                                                                      of: target
                                                                     });
}

Here is the jQuery page for testing the different positions.

EDIT:

Here is a fiddle showing it aligning on the right... maybe the issue is somewhere else in your CSS or html? As in the fiddle I've been testing using jQuery 1.5.1, jQuery UI 1.8.9 and the base theme CSS file.

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