2

ユーザーがドキュメントの一番下までスクロールしたことを検出しようとしています。私の現在のソリューションは、デスクトップブラウザー、およびランドスケープモードのMobile Safariで正常に機能します（1pxの変動はまだ説明できません）。ただし、ランドスケープモードのMobileSafariではまったく異なる結果が得られます。

ここに実用的な例があります：http：//dl.dropbox.com/u/5634676/checkbottom.html

検出ルーチンは次のように要約されます。

if ($(window).scrollTop() + $(window).height() >= $(document).height())) {
  // Bottom reached
}

2つのモードの違いを説明し、ユーザーがドキュメントの一番下までスクロールしたことを確実に検出するのに役立ちますか？

アップデート

theflyingbrushによって指摘されたバグを修正するリンクされた例を更新しました。横向きモードと縦向きモードの結果が近づいています（ただし、まだ説明されていない52pxの変動があります）。ただし、重要なのは、縦向きモードと横向きモードの両方で、ページの一番下までスクロールしても検出されないことです。

4

2 に答える 2

1

デバイスの向きが変わるとウィンドウの高さが変わり、doc ready に保存されている windowHeight 変数が無効になります。orientationchange イベントをリッスンし、ウィンドウの高さを再計算して更新します。何かのようなもの：

window.addEventListener("orientationchange", change);

function change(){
    windowHeight = $(window).height();
}

編集：ビューポートのスケールも含まれるため、これを混乱させます。動作中のバージョンへのリンクは次のとおりです: http://appunit.co.uk/scroll

$(window).scrollTop() は、アドレス バーが画面外にスクロールされるまで 0 を返すため、計算ではアドレス バーの高さを考慮する必要があります。アドレスバーの高さ (60px) を scrollTop に追加して、スクロールされる距離を取得します。width=device-width を指定して HTML にビューポート メタ タグを設定していない場合、これはさらに複雑になります。その場合、ビューポートは 320x356 から 980x1091 にスケーリングされ、アドレス バーが占める仮想の高さもスケーリングされます。概要：

var scaleFactor = ($(window).height()/356).toPrecision(2);
// toPrecision(2) prevents rounding error..
var addressBarHeight = 60 * scaleFactor;

// and when calculating scrollTop
var scrollTop = addressBarHeight + $(window).scrollTop();
于 2013-01-28T17:35:47.340 に答える