jQueryまたはjavascriptでページの可視領域の中心DIV

Question

マイページが非常に大きいです。垂直スクロールバーが表示されます。私はページの真ん中にいるので、スクロールして&まで上がることができるとします。私は、私がページの真ん中にいるとき、私のdivは、ページの中心ではなくページの可視領域の中央に配置される必要があります。私は私のブラウザウィンドウのページの可視領域の中心にdivを表示する必要があります。私は私が何を言いたいかを説明することができるとは確信していません。可視領域は、ページ全体ではなく、スクロールなしで一度に見ることができる領域を意味します。

ので、ページ全体ではないページの表示領域の高さ&幅を取得する方法を私を導いてください。 ページの可視領域の中心に配置する方法はガイドしますが、ページ全体を配置する方法は教えてください。可視領域は、ページをスクロールせずに一度に見ることができる領域ではなく、ページ全体を意味するものではありません。

私はGoogleで検索し、ガイドラインを発見し、私はそれに応じてコードを書いたが、それは動作しませんでした。

ここに私の要件に応じて動作しない私のコードです。

$(".ui-dialog").animate({ 
left: viewportwidth/2 - $(".ui-dialog").outerWidth()/2, 
top: viewportheight/2 - $(".ui-dialog").outerHeight/2 
}, 1000); 

これはFFのブラウザでは動作しませんし、それが何であれ、私は目の外に出、私のjQueryのダイアログに配置することをIEで問題が発生し

var viewportwidth; 
var viewportheight; 

// the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight 

if (typeof window.innerWidth != 'undefined') { 
    viewportwidth = window.innerWidth, 
    viewportheight = window.innerHeight 
} 

// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document) 

else if (typeof document.documentElement != 'undefined' 
&& typeof document.documentElement.clientWidth != 
'undefined' && document.documentElement.clientWidth != 0) { 
    viewportwidth = document.documentElement.clientWidth, 
    viewportheight = document.documentElement.clientHeight 
} 

// older versions of IE 

else { 
    viewportwidth = document.getElementsByTagName('body')[0].clientWidth, 
    viewportheight = document.getElementsByTagName('body')[0].clientHeight 
} 

のようにビューポート領域を検出。

ので、どのようにページ上の表示領域でのdivを表示することを把握するために私を助けてください。あなたはそのためにJavaScriptを必要としない

おかげ

Answer 1

。あなたは単に "position：fixed;"を使うことができます。

例：それを行うか、jqueryのことで、すべてのCSSを設定する方法http://jsfiddle.net/hENGL/