Диалоговое окно jQuery UI всегда справа вверху

Question

Я пытаюсь расположить диалоговое окно справа от тега привязки, но безуспешно.

Я проверил решения при расположении диалогового окна jQuery UI , но ни один из них не работает.

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
                                                                     });
}

И этот 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>

Answer 1

Добавление верхнего обозначения к атрибутам my и at, похоже, работает - при условии, что вы хотите выровнять верх и правую часть привязки (протестировано в Chrome 11.0.6 и 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
                                                                     });
}

Вот страница jQuery для проверки различных позиций.

РЕДАКТИРОВАТЬ:

Вот скрипка , показывающая ее выравнивание справа... может проблема в другом CSS или html?Как и в скрипте, я тестировал с использованием jQuery 1.5.1, jQuery UI 1.8.9 и CSS-файла базовой темы.

Answer 2

OOpps - мой брат использовал мой компьютер, и я представил решение как он, а не как я

Путь ленивого человека

//get reference to the element
var target = $('#note'+row_index);

//add an empty span at the very end of the element [only once]
if($('#note'+row_index+'_getPosition').length==0){ 
  $(target).after('<span id="note'+row_index+'_getPosition"></span>')
  }

// get position of newly inserted span
var position = $('#note'+row_index+'_getPosition').position();

//finally call the dialog using position as below
position : [position.left,position.top]

Answer 3

путь ленивого человека

//get reference to the element
var target = $('#note'+row_index);

//add an empty span at the very end of the element [only once]
if($('#note'+row_index+'_getPosition').length==0){ 
    $(target).after('<span id="note'+row_index+'_getPosition"></span>')
    }

// get position of newly inserted span
var position = $('#note'+row_index+'_getPosition').position();

//finally call the dialog using position as below
position : [position.left,position.top]