FIDDLE IS HERE (コンソールへのログ)
状況は、 ページが<H1>で見つかったマージンよりも大きいマージントップを持つ で始まる場合<body>です。
これにより、<body>がページの下に押し込まれますが、の margin-top$('body').offset().topに設定されたままになります。<body>もちろん、これにより、本体のダミー要素が間違った位置にあるため、デバッグ要素 (要素の位置を強調表示する) が正しくなくなります。
興味深いことに、残りの$(elem).offset()値は の子孫に対して正しいです<body>。
while ループを使用して body の再帰的に最初の子のマージントップを手動でチェックするという短い修正はありますか?
Safari 6 の問題に気付きましたが、Chrome でも同様に見つかると思います。
オフセットに加えて、要素の高さからhtml要素を引いた差を使用するとうまくいく場合がありbodyます。
console.log("body.offset().top = "+ ($('html').offset().top + $('html').height() - $('body').height() ));
更新: このソリューションは、ページに margin-bottom がない場合にのみ機能します。
さらに、ページの下部に明確な div を追加できます。
$('body').append("<div style=\"clear: all;\"> </div>");
div が機能するにはコンテンツが必要であることに注意してください。
ここでgetBoundingClientRectいかに高速で素晴らしいかについての John Resig の投稿を見つけました。offset()
代わりにこの方法を使用しますが、この同じ問題に悩まされないことを願っています。
更新：良さそうですね！（非整数のトップ値は、何とかスタイルを持っているためです-webkit-margin-before: 0.67em;）
body には margin=8 があることがわかります
jQuery 1.9.0 はこの問題に対処しています。どうもありがとう、jQueryは素晴らしいです。
a[0].style.marginTopCSSで宣言した後でも初期化されていないため、何も返されませんでした。
したがって、初期化に注意する必要がありますa[0].style.marginTop