ios苹果系统,js 滑动屏幕、锚定无效

现象:window.addEventListener监听touch无效,划不动屏幕,但是代码逻辑都有执行到。

scrollIntoView也无效。

原因:这是因为 iOS 的触摸事件处理机制和 touch-action: none 的设置有关。ios有太多得交互动作,从而会影响到touch监听

解决:

  1. 将 touch-action: none 改为 touch-action: pan-y,允许垂直方向的滑动
  2. 添加了passive: false 触摸事件阻止其它交互动作得覆盖
  3. 增加了滑动阈值(50px)来减少误触
  4. 在每次滑动后更新起始位置,使连续滑动更流畅
javascript 复制代码
 // 添加触摸事件支持
    window.addEventListener('touchstart', (e) => {
       
    }, { passive: true });

    window.addEventListener('touchmove', (e) => {
        
    }, { passive: false });

    window.addEventListener('touchend', () => {
        
    },  false );





.container {
    touch-action: pan-y;
}
相关推荐
striver_#几秒前
百度前端社招面经二
前端
xcnn_1 分钟前
前端入门——案例一:登录界面设计(html+css+js)
前端·css·html
ST.J2 分钟前
前端笔记2025
前端·javascript·css·vue.js·笔记
拉不动的猪3 分钟前
回顾vue中的Props与Attrs
前端·javascript·面试
开开心心loky17 分钟前
[iOS] push 和 present Controller 的区别
ui·ios·objective-c·cocoa
Jerry39 分钟前
使用 Material 3 在 Compose 中设置主题
前端
耶啵奶膘1 小时前
uni-app头像叠加显示
开发语言·javascript·uni-app
chéng ௹1 小时前
uniapp 封装uni.showToast提示
前端·javascript·uni-app
生擒小朵拉1 小时前
STM32添加库函数
java·javascript·stm32
tuokuac1 小时前
nginx配置前端请求转发到指定的后端ip
前端·tcp/ip·nginx