移动端通过scroll事件固定一个容器到顶部出现的问题?
var $til = $(".wrap-title"),tilTop = $til.offset().top;
$(window).on("scroll", function() {
var newTop = $(document).scrollTop();
if(newTop > tilTop) {
$til.addClass("tofixed");
}
else{
$til.removeClass("tofixed");
}
});
当滚动手机页面到wrap-title的容器时,让容器固定到顶部(fixed),在pc上是没有问题的,
但安卓的手机浏览器就卡那么一下,才实现效果,一点都不流畅。
ios上貌似当手指离开屏幕时才实现效果?
移动端怎么会那么多问题?我该怎么修改代码呢?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
页面滚动结束之后才会执行回调, 移动端就是这样的, 代码无法改变这种内置的行为. 如果要改, 可能得做页面滚动模拟, 成本太大.
你可以选一个这种的缓慢显示的效果来过渡
有可能是因为元素fixed后浮动起来了,他所在的位置空了,所以就显得页面闪顿了一下,你可以让它fixed后,给它所在的位置填充上