防止整页缩放

Posted 2023-03-04

【中文标题】防止整页缩放

【英文标题】：Prevent full page zoom

【发布时间】：2019-08-01 23:10:55

【问题描述】：

我有一个页面，在半顶部区域有一个 svg 地图，在半底部区域有一个索引。此页面将显示在触摸屏上。在顶部区域（地图）上使用 touch-action:pinch-zoom 时，我想将索引（底部区域）与缩放隔离开来。我尝试在顶部使用 iframe，但它一直在缩放整个页面

【参考方案1】：

尝试将其添加到 html 文档的标题中 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

在地图上保留touch-action:pinch-zoom。