ウィンドウ内にダイアログボックスの中心を作るにはどうすればいいですか？

Question

私はこのように私はjQuery UIのダイアログボックスのサイズを変更しない：

height: $(window).height(), 
width: $(window).width(), 

しかし、今では、ウィンドウの中央にはもはやです。私はそれが中心になることができるいくつかの方法はありますか？

Answer 1

要件

function positionLightboxImage() { 
    var top = ($(window).height() - $('#lightbox').height())/2; 
    var left = ($(window).width() - $('#lightbox').width())/2; 
    console.log("The calculated position is:"); 
    console.log(top,left); 
    $('#lightbox') 
    .css({ 
     'top': top + $(document).scrollTop(), 
     'left': left 
    }) 
    .fadeIn(); 
    console.log('A jQuery selection:'); 
    console.log($('#lightbox')); 
} 

Answer 2

ごとに変数を変更する機能 - 以下試しダイアログが表示されるべき場所を指定します。可能な値： 1）ビューポート内の位置を表す単一の文字列： 'center'、 'left'、 'right'、 'top'、 'bottom'。 2）x、y座標のペアを含む配列（ビューポートの左上からのオフセット）（例：[350,100]） 3）x、y位置の文字列値を含む配列（例：['right'、 'top' ]をクリックします）。

コード例

positionオプションを指定してダイアログを初期化します。 $（ "。セレクタ"）.dialog（{position： 'top'}）; initの後にpositionオプションを取得または設定します。 // getter var position = $（ ".selector"）.dialog（ "option"、 "position"）; //セッター $（ "。セレクタ"）.dialog（ "option"、 "position"、 'top'）;

position : 'center' 

Answer 3

ダイアログボックスがabsoluteポジショニングを使用している場合は、リサイズ後にこれを試すことができます。

$('#dialog').animate({ 
    'top' : ($(window).height() - $('#dialog').outerHeight())/2 + $(document).scrollTop(), 
    'left': ($(window).width() - $('#dialog').outerWidth())/2 + $(document).scrollLeft() 
}); 

これは中央に、ダイアログボックスを移動します。場合には、ダイアログボックスでは、計算から$(document).scrollTop()と$(document).scrollLeft()を省略することができfixedポジショニングを使用していますそうでなければ

、