嗨,我正在编写一个包含元素列表的网页(在 UL 中)
每个第 11 个元素都粘在页面顶部。因此,当您向上滚动并且 #11 到达页面顶部时,它会停止。(我实际上克隆了 LI 并将其粘贴到顶部)
现在,当第 22 个元素出现时,它会“推动”第 11 个元素。
基本上,我正在尝试重新创建您在他们的地址簿上看到的 iOS 标头。
该代码使用 jQuery 并绑定到窗口的滚动事件。然后我计算元素的位置并施展魔法。
这一切都在桌面(Chrome、Firefox,甚至 IE!)上运行得非常出色。但是,当我在 Galaxy S3 上的 Chrome 上对其进行测试时,在检测顶部的元素时似乎存在延迟。
我的猜测是,由于移动设备上的处理能力,它们不会像在桌面上那样频繁地触发滚动事件。如果您从另一篇 SO 帖子中查看此小提琴并在移动设备上运行它,您将看到同样的问题。
http://jsfiddle.net/jaibuu/YqPzS/
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/
那么是否有可能在移动设备上获得与桌面上相同的滚动速度/分辨率?
谢谢。