jone/mama-box
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(首页): 禁止双指缩放和双击放大，页面固定 (v26100105)

Browse Source 
viewport 加 user-scalable=no / maximum-scale=1；iOS 微信忽略该设置，
JS 再拦 gesture 事件与多指 touchmove；html 也加 touch-action:manipulation

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Karlcarlo
2026-10-01 02:40:34 +00:00
parent 15dabcea5f
commit 1fa565ff2f
3 changed files with 10 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
index.html
View File

@@ -2,12 +2,12 @@
<html lang="zh-CN"> <html lang="zh-CN">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover"> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover">
<meta name="theme-color" content="#F4593C"> <meta name="theme-color" content="#F4593C">
<meta name="mobile-web-app-capable" content="yes"> <meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-capable" content="yes">
<title>兜爸心选 · 孕育陪伴</title> <title>兜爸心选 · 孕育陪伴</title>
<!-- V:26100104 缓存版本标记：改 css/js 时同步 bump 该值（与 js/app.js 的 VER 同源），静态资源按 mtime 走 ETag 自动刷新 --> <!-- V:26100105 缓存版本标记：改 css/js 时同步 bump 该值（与 js/app.js 的 VER 同源），静态资源按 mtime 走 ETag 自动刷新 -->
<link rel="stylesheet" href="mama-box.css"> <link rel="stylesheet" href="mama-box.css">
<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script> <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
<!-- 共享助手：授权/跳商城/位置上报（分享卡片同步，见 docs/h5-auth-standard.md 第四节） --> <!-- 共享助手：授权/跳商城/位置上报（分享卡片同步，见 docs/h5-auth-standard.md 第四节） -->

8
js/app.js
View File

@@ -3,7 +3,7 @@
(function () { (function () {
'use strict'; 'use strict';
/* 页面版本号（YYMMDD+序号）：显示在「关于兜爸心选」页底部；bump 时同步 head 注释与 ?v= */ /* 页面版本号（YYMMDD+序号）：显示在「关于兜爸心选」页底部；bump 时同步 head 注释与 ?v= */
var VER = '26100104'; var VER = '26100105';
const $ = (s, c) => (c || document).querySelector(s); const $ = (s, c) => (c || document).querySelector(s);
const $$ = (s, c) => Array.from((c || document).querySelectorAll(s)); const $$ = (s, c) => Array.from((c || document).querySelectorAll(s));
@@ -2983,6 +2983,12 @@
if (c) c.textContent = state.kickQuick || 0; if (c) c.textContent = state.kickQuick || 0;
} }
/* 禁止双指缩放（2026-10-01 用户要求首页固定）。iOS 微信会忽略 viewport 的 user-scalable=no，
所以再拦一道：iOS 的 gesture 事件 + 多指 touchmove；双击放大由 CSS touch-action:manipulation 处理。 */
(function noZoom() {
['gesturestart', 'gesturechange', 'gestureend'].forEach(t => document.addEventListener(t, e => e.preventDefault(), { passive: false }));
document.addEventListener('touchmove', e => { if (e.touches.length > 1) e.preventDefault(); }, { passive: false });
})();
/* ================= 首页「孕育工具」卡片（box_app 封装数胎动平台数据，2026-09-22） ================= /* ================= 首页「孕育工具」卡片（box_app 封装数胎动平台数据，2026-09-22） =================
数据源：GET /api/mp/public/mama-box/tool-cards（box_app 归一化后的稳定契约； 数据源：GET /api/mp/public/mama-box/tool-cards（box_app 归一化后的稳定契约；
上游是数胎动平台的 GET /taidong/api/user/app-cards，H5 不直连、也不持有上游 token）。 上游是数胎动平台的 GET /taidong/api/user/app-cards，H5 不直连、也不持有上游 token）。

2
mama-box.css
View File

@@ -91,7 +91,7 @@ em{font-style:normal}
/* ---------- 无障碍 / 触控 / 动效（WK 审计补齐） ---------- */ /* ---------- 无障碍 / 触控 / 动效（WK 审计补齐） ---------- */
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%} html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body,button,a,input,textarea,select{-webkit-touch-callout:none;touch-action:manipulation} html,body,button,a,input,textarea,select{-webkit-touch-callout:none;touch-action:manipulation}
button,a,input,textarea,select,summary,[tabindex]{transition:box-shadow .15s ease} button,a,input,textarea,select,summary,[tabindex]{transition:box-shadow .15s ease}
:focus{outline:none} :focus{outline:none}
:focus-visible{outline:3px solid rgba(244,89,60,.55);outline-offset:2px;border-radius:6px} :focus-visible{outline:3px solid rgba(244,89,60,.55);outline-offset:2px;border-radius:6px}