0

私はjquery-mobileアプリに取り組んでおり、少し問題が発生しました。アプリのページの「トップに戻る」穏やかなスクロールに jquery の animate() を使用したいと思います。

次のコード スニペットは、私のテスト ブラウザーの 1 つを除くすべてでうまく機能します。デスクトップの Chrome と Firefox、iPhone の Safari、Android の Firefox Beta はすべて優れています。デフォルトの Android ブラウザー (webkit-mobile IIRC) は、アニメーションが完了するとアンカーに戻ります。

$("a[href='#top']").live('click', function() {
    $("body").animate({ scrollTop: 0 }, "slow", function() {
        // anim complete
        setTimeout(function() { // not needed, attempt to brute-force
          window.scrollTo(0,0);
          alert('foo'); // <- Android scrolls back to anchor after showing alert
        }, 50);
    });
});

誰でも、a) Android ブラウザがスクロールバックする原因、および/または b) 回避策を提案できますか? それが違いを生む場合、私が現在テストしているデバイスは Android 2.3.2 を実行しています。

4

1 に答える 1

0

無関係な問題に関するドキュメントを読んで、私は$ .mobile.silentScroll（）メソッドに出くわしました-明らかにこの状況のた​​めに設計されました。

これが私の最初の脳死の回避策です：

function scrollToTop() {
    var scrollPos = $(document).scrollTop();
    scrollPos -= 60;
    if (scrollPos < 1) { scrollPos = 1; }
    $.mobile.silentScroll(scrollPos);
    if (scrollPos > 1) { setTimeout(scrollToTop, 60); }
}

$("a[href='#top']").live('vclick', function() {
    scrollToTop();
    return false;
});

Androidブラウザが元の形式のアンカーにスクロールバックする理由についてはまだ興味があります。

于 2011-09-16T20:05:54.847 に答える