2012-06-18 10 views
5

私はウェブブラウザウィンドウの本体の正確な高さを取得したいと思います。私はinnerHeightを試しました、クライアントは私がグーグルで取得する他のすべてのソリューションを取得します。いずれも正確な高さを示していません。私はこれらの関数によって提供される高さからいくつかの値を減算することによって高さを調整しなければなりませんか?どのようにしてこの問題から抜け出すことができますか?私は何かが欠けていると思う。助けてください。あなたはこれを達成するためのjQueryを使用することができますウェブブラウザウィンドウのボディの正確な高さを取得する方法は?

おかげ

+0

jQueryソリューションはあなたに適していますか? – Dipak

答えて

13

一部のブラウザでは、ウィンドウの高さが と正しくないと報告されています。 が違う - 特にモバイルブローwsersは異なるビューポートコンセプトを持っています。私は、関数を使っていくつかの異なる値をチェックし、どちらか大きい方を返します。例えば

function documentHeight() { 
    return Math.max(
     window.innerHeight, 
     document.body.offsetHeight, 
     document.documentElement.clientHeight 
    ); 
} 

編集:私はちょうどjQueryのそれをしない方法を見て、それが実際にMath.maxと一連のプロパティを使用しない - それはチェックリストは、上記の私の例のものと若干異なっているが、私は通常、jQueryチームが私よりもこのようなことに優れていると信じています。ここにnon-jQuery jQueryソリューションがあります(それが意味をなさなければ):

function documentHeight() { 
    return Math.max(
     document.documentElement.clientHeight, 
     document.body.scrollHeight, 
     document.documentElement.scrollHeight, 
     document.body.offsetHeight, 
     document.documentElement.offsetHeight 
    ); 
} 
+0

には、簡単で*「非JQuery jQueryソリューション」*、ha – LinusGeffarth

+1

:)があります。おそらくおそらく、おそらくまだ有効/有用でしょうか?最近、ブラウザー/画面のピクセルの大きさについてはあまり気にしないでください。すべて流動的で、伸縮性があり、応答性があります。 JavaScript/jQueryよりも多くのCSS3とメディアクエリ。 –

2

は...

$(document).ready(function(){ 
    browserWindowheight = $(window).height(); 
    alert(browserWindowheight); 
}); 
+1

彼はjqueryを使っているとは言いませんでした。 – nunespascal

+2

jqueryを使用しなければならないと言いましたが...なぜ下降? – Subhajit

+2

彼はどこでjqueryを使いたくないと言いますか? –

1

あなたが使用してみました:Internet Explorer用の

window.outerHeight (this is for IE9 and other modern browser's height) 

を下位互換性モードで、

を使用
document.body.offsetHeight 

そしてまた、Internet Explorerの(標準モード、document.compatMode == 'CSS1Compat'):

document.documentElement.offsetHeight 

詳細については、以下を見てください:

関連する問題