JavaScriptの文書の高さ合併症
-
23-09-2019 - |
質問
はMozilla&IEの開発者が同時にオペラの実装を表現するために彼らの身長要素の実装を変更しているように見える...私は以前に心配する必要はありませんでした。
var height = (document.height !== undefined) ? document.height : document.body.offsetHeight;
空白の文書に対して実行する場合、次に、ドキュメントの高さとして0を返します。私の実装では、動的に構築するために、真のクライアントビューポートを知っている必要があります。それらが使用されるようにChromeとSafariは、まだ行動している。
scrollHeight、およびclientHeightはまったく同じ行動している。
複雑な事項にdocument.heightとdocument.body.offsetHeightは今もその代わり、彼らはに使用されるようにのみ表示可能領域の口座に、ドキュメントの完全な高さを取っている...私は方法や使用済みのA間隔古いテーブルを試してみました2000px X 1pxの透明andthe文書の高さは、予想通り、自然ChromeとSafariはまだ仕事....今2000に設定してからのみ閲覧可能サイズを与えるされます。
私はこの問題を解決することは非常に絶望しています。
解決
ビューポートの高さは、ドキュメントのプロパティではありませんが、ウィンドウのそれを見ました。あなたwindow.innerHeight
から、ビューポートの高さを取得します。
document
持つものだけwindow.inner
寸法を提供していないIE用のフォールバックとして必要とされています。 IEは、(技術的には間違って)あなたが(もっと誤っ)の代わりにビューポートを表すdocument.documentElement
作る癖モードでない限り、あなたは、そのclientHeight
からの高さを得ることができるので、document.body
は、ビューポートを表します。 (document.height
は完全に非標準であり、それを避けるため)。
だから、要約すると、と仮定して、あなたが癖モードをサポートする必要がある(例えば、あなたが何を期待させない):
var height= (
'innerHeight' in window? window.innerHeight :
document.compatMode!=='BackCompat'? document.documentElement.clientHeight :
document.body.clientHeight
);
他のヒント
私はジェームズPaldoseyのサイトから得たこと、これを使用します>
function getDocHeight() {
//utility function to find dimensions of page
var D = document;
return Math.max(
Math.max(D.body.scrollHeight, D.documentElement.scrollHeight),
Math.max(D.body.offsetHeight, D.documentElement.offsetHeight),
Math.max(D.body.clientHeight, D.documentElement.clientHeight)
);
}