Question

您好我正在撰写一个网页，其中包含一系列元素（在UL中）

每个第11个元素都会粘在页面顶部。因此，当您向上滚动并且＃11点击页面顶部时，它会停止。（我实际上克隆了LI并将其粘贴到顶部）

现在，当第22个元素出现时，它会“推”第11个元素。

基本上我正在尝试重新创建您在地址簿上看到的iOS标题。

代码使用jQuery并绑定到窗口的scroll事件。然后我计算元素的位置并做出魔力。

这一切都在桌面上非常出色（Chrome，Firefox，甚至是IE！）。然而，当我在我的Galaxy S3上的Chrome上测试它时，检测到顶部的元素似乎有一个滞后。

我的猜测是，由于移动设备上的处理能力，他们不会像在台式机上那样频繁地触发滚动事件。如果你从另一个SO帖子看这个小提琴并在移动设备上运行，你会看到同样的问题。

function checkScrolling() {

    if ($('#content').scrollTop() > mastheadHeight) {
        menu.addClass('fixed');
    } else {
        menu.removeClass('fixed');
    }

}

$('#content').scroll(function () {
    checkScrolling();
});

尝试做同样事情的jquery插件也有类似的问题。看看这个页面上的演示

http://www.teamdf.com/web/showcasing-jquery-list-with-a-fake-iphone/147/

因此可以在移动设备上获得与在桌面上滚动相同的速度/分辨率吗？

感谢。

Answer 1

您可以尝试使用Zepto。使用winscrolled可以更轻松。

移动浏览器上的scrollTop（）延迟/滚动分辨率问题

1 个答案: