0

我正在开发一个 jquery-mobile 应用程序并且遇到了一些问题;我想使用 jquery 的 animate() 来轻轻滚动“回到顶部”我的应用程序页面。

除了我的一个测试浏览器之外,以下代码片段在所有浏览器中都运行良好。桌面上的 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 Browser为什么要滚动回原来形式的锚点。

于 2011-09-16T20:05:54.847 回答