H5移动端禁止页面缩放(使用Android和IOS)

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />

标签说明:

  1. width: 设置viewport的宽度,正整数/字符串 device-width
  2. height: 设置viewport的高度,正整数/字符串 device-height
  3. initial-scale: 设置设备宽度与viewport大小之间的缩放比例,0.0~10.0之间的正数
  4. maximum-scale: 设置最大缩放系数,0.0~10.0之间的正数
  5. minimum-scale: 设置最小缩放系数,0.0~10.0之间的正数
  6. user-scalable: 如果设置为no,用户将不能缩放网页,默认为yesyes / no

注意:

IOS10以后版本不接受meta标签,可以通过js监听手势控制来实现禁止页面缩放:

document.addEventListener('gesturestart', function (event) {
    event.preventDefault()
})
posted @   涛啊声依旧  阅读(1173)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 全网最简单!3分钟用满血DeepSeek R1开发一款AI智能客服,零代码轻松接入微信、公众号、小程
· .NET 10 首个预览版发布,跨平台开发与性能全面提升
· 《HelloGitHub》第 107 期
· 全程使用 AI 从 0 到 1 写了个小工具
· 从文本到图像:SSE 如何助力 AI 内容实时呈现?(Typescript篇)
点击右上角即可分享
微信分享提示