Диалоговое окно пользовательского интерфейса jQuery внутри iframe


Я разрабатываю приложение sp2013, что означает, что оно использует iframes. В частности, это очень большой iframe, который занимает большую часть экрана. Во многих случаях я открываю диалоговые окна пользовательского интерфейса jquery. Они должны появляться в середине видового экрана, что замечательно, за исключением того, что они появляются в середине iframe, а не в середине видимого экрана.

Есть ли способ, которым я могу сказать jQuery ui, чтобы он смотрел на окно.свойства прокрутки top, а не фреймы?

Edit: iframe и родительский объект находятся в одном домене, поэтому междоменные проблемы не являются проблемой.

2 4

2 ответа:

Хорошо, я нашел решение. Объявляя свой диалог, я сделал следующее:

$("selector").dialog({
    position: {my: "center", at: "center", of: window.top}
});

HTML:

<div id="dialog">Hello, world!</div>

JQuery:

alert('Window size: '+window.innerWidth);
var dialogWidth = 500;
var dialogHeight = 200;
var dialogX = (window.innerWidth - dialogWidth)/2;
var dialogY = (window.innerHeight - dialogHeight)/2;
$("#dialog").dialog({ position: [dialogX,dialogY], width: dialogWidth, height: dialogHeight }, 500);
alert('Dialog position: '+$("#dialog").dialog( "option", "position" ));

Скрипка: http://jsfiddle.net/3vjsa/3/

Работает внутри iframe. По центру горизонтально и вертикально. Если центрированное положение окна упадет за пределы iframe, оно будет перемещено к краю iframe. Добавлены предупреждающие сообщения для отображения ширины окна и положения диалогового окна.