Repository navigation
Releases: leoshone/zhihu-desk2mob
Release list
v1.4.9: 专栏推荐列表右侧图 3 行高 + 正文第 4 行起全宽
更新记录
- 专栏页（
/column-square）「推荐专栏」列表里那张右侧的文章预览图，现在按正文行数缩小（默认 3 行高，沿用首页封面的字形盒口径N×28−13px），图片右侧的正文前 3 行绕排、第 4 行起回落整列全宽（不再是图片旁那条永久窄列）。 - 实现要点（三处 CSS + 一处 JS 一起才成立）：
.article-content退出 flex 改display:block（flex 会忽略float）；- 图
float:right+ 高 = 3 行字形盒 +width:auto保原比例； .article-text解 BFC（overflow:visible）→ 前 N 行绕右、第 N+1 行起全宽；- 因这张图在 DOM 里排在文字之后（浮动按源码顺序落位），另用
fitColumnPreview()把图移到容器首位，否则图会沉到正文下方。只作用于带图卡片（:has(.article-image)），不动无图卡。
- 新增回归测试
scripts/test-column-thumb.js（8 项断言，含「窄→宽」过渡判别），已在真机做改前/改后对照（v1.4.8 改前 FAIL ③④⑤⑧，本版改后 8/8 PASS）。
安装地址
https://raw.githubusercontent.com/leoshone/zhihu-desk2mob/main/zhihu-desk2mob.user.js
校验（LF blob sha256）
019b7dec14e1d13b17e296c2dce15bf8707f741a1a673fad9e639cca60aa4fa9
v1.4.8 — 热榜：缩略图改为 2 行高 + 修掉缩小后残留的灰色底色（::after 占位）
v1.4.8 — 热榜：缩略图改为 2 行高，并修掉缩小后残留的灰色底色
热榜列表的缩略图从 3 行高（132×73） 再缩到 2 行高 = 81×45，左侧标题列更宽（每行约 9~10 字）。图片顶边仍与标题第 1 行的字形顶对齐。
灰色底色的根因
缩小图片后，图片右侧/底部会露出一圈灰色底。原因不是背景色写在锚点上，而是知乎在 .HotItem-img 上挂了一个 ::after 占位层：
.HotItem-img img, .HotItem-img::after { width: 190px; height: 105px; border-radius: 4px; }
.HotItem-img::after { position: absolute; left: 0; top: 0;
background-color: rgba(25,27,31,.05); content: ""; }它和图片用的是同一条写死 190×105 的规则，且不随锚点尺寸走 —— 脚本只缩小了锚点与 <img>，这层仍是固定的 190×105，于是从缩小后的图片右侧（差 58px）、底部（差 32px）露出来，就是那块灰。本版把它也改成 width/height: 100%，灰底即与图片严丝合缝。
开关
CFG.hotThumbLines：缩略图行数，默认 2（本版从 3 下调）；可填 0（不干预，保持知乎原样）/ 2 / 3 / 4。
测试
node scripts/test-hot-thumb.js --installed —— 10 项断言。本版新增第 ⑩ 条「::after 灰色占位与图片同尺寸」，改前/改后对照确认有判别力（在改动前的 v1.4.7 上跑：30/30 条超差、最大 57.9px）。
安装
https://raw.githubusercontent.com/leoshone/zhihu-desk2mob/main/zhihu-desk2mob.user.js
从 Release 附件安装的也会自动更新（脚本头部 @updateURL / @downloadURL 指向 raw main）。
sha256（LF blob）：
c7168b762b39cb60797c69a46557f700388a59cc1e9764a5b54109009c166b04 zhihu-desk2mob.user.js
v1.4.7 — 热榜：条目缩略图按标题行数定尺寸（默认 3 行高）
v1.4.7 — 热榜：条目缩略图按标题行数定尺寸（默认 3 行高）
热榜列表里的图片原来固定 190×105（占内容列 326px 的 58%），左侧标题只剩约 76px 宽（每行 4~5 字）。现在改成按标题行数定高：默认 3 行高 = 132×73，标题列宽增到 134px（每行约 7 字），图片顶边与标题第 1 行的字形顶对齐（偏差 -0.4px）。
热榜条目是 flex row（序号 | 内容 | 图片），图片是右侧 flex 子项而非浮动 —— 改小即可让文字列自动变宽，没有首页信息流的绕排问题。但有一个隐藏耦合，连带修了三处（缺一不可）：
- 「N 万热度 / 分享」行收回文档流 —— 该行原是
absolute; bottom:16px锚在卡片底，桌面版靠 105px 的图片撑出空带让它落脚。图片改小后卡片塌到 115px，这行就叠在摘要文字上（实测 30 条里 28 条重叠）。改回 static 后自然排在摘要下方（重叠 0）。 - 「932 万热度」不再叠字 —— 该文本与 49px 的「分享」按钮同处一个 flex 行，窄列里可用宽度差 ~3px，文本在空格处折成两个行框、上下叠字（容器高只有 16px 装不下两行）。
nowrap后收成一行（73px），不压按钮。 - 「分享」按钮不再被裁 —— metrics 行进文档流后被
.HotItem-content的overflow: hidden裁掉 20px（真机上「分享」只露「分…」；原生 absolute 时其实也被裁，只是藏在图片空带里看不出来）。解开 overflow 后 30 条按钮 0 被裁，标题/摘要自身的省略号不受影响。
开关
CFG.hotThumbLines：缩略图行数，默认 3；可填 0（不干预，保持知乎原样）/ 2 / 3 / 4。
测试
node scripts/test-hot-thumb.js --installed —— 9 项断言（图高 = 3 行字形盒高、图宽收窄、metrics static、零重叠、顶对齐、不叠字、按钮不被裁……），改前/改后对照确认有判别力。
安装
https://raw.githubusercontent.com/leoshone/zhihu-desk2mob/main/zhihu-desk2mob.user.js
从 Release 附件安装的也会自动更新（脚本头部 @updateURL / @downloadURL 指向 raw main）。
sha256（LF blob）：
acf962bb4d407fd624ebcbdf76022a0c71988625cc190096c8843b0dffa306d1 zhihu-desk2mob.user.js
v1.4.6 — 图片查看器：放大的图片回到屏幕中央
v1.4.6 — 图片查看器：放大的图片回到屏幕中央
修复「评论/正文里点开图片后，放大的图片整体跑出屏幕、只露左上角」的问题 —— 现在图片居中显示在屏幕中央。
根因
知乎图片查看器的「居中 + 放大」全编码在 img 的 transform 里（matrix(3.95,…,344,790)，逐帧重写），那套坐标按「页面未被反缩放」假设计算。脚本为适配桌面版给页面设了根 zoom（≈2.49）做反缩放，绘制连同坐标一起被放大，图片就整体落到屏幕外。
修法
把 img 从知乎的动画布局里解放出来，用 CSS 原生居中：position: fixed + inset: 0 + margin: auto + transform: none。fixed 元素的 inset: 0 就是视觉视口盒（天然含 zoom 换算），margin: auto 让图片在其内居中；尺寸按浮层 rect 的 94% / 88% 约束，每次打开/resize 时刷新。
试过并作废的弯路：给浮层设 zoom = 1/Z —— 图片确实回到知乎预期的布局位置，但 zoom 把浮层内部的一切（含视口尺寸解释）都除以 Z，图片缩到约 1/6 面积。zoom 与 fixed 定位、根 zoom 的三重耦合无法靠它修复。
测试
node scripts/test-image-viewer.js --installed（v1.4.7 起改为受控夹具触发：真实 adb tap 的坐标换算不可靠 —— CDP 布局 px 与屏幕物理 px 的比例随地址栏伸缩/缩放变化，多次 tap 落不到图上且会误触无关 UI；夹具与真实查看器同构，对「脚本是否接管并居中」同样有判别力：v1.4.5 下「接管/居中/不出屏」三条必 FAIL）。
安装
https://raw.githubusercontent.com/leoshone/zhihu-desk2mob/main/zhihu-desk2mob.user.js
从 Release 附件安装的也会自动更新（脚本头部 @updateURL / @downloadURL 指向 raw main）。
sha256（LF blob）：
978d9763c872f3015dbdd714183fde4320ad01ccd849c5b3fa77baed383819e7 zhihu-desk2mob.user.js
v1.4.5 — 「关注者 ｜ 被浏览」中间的竖线居中
v1.4.5 — 「关注者 ｜ 被浏览」中间的竖线居中
问题页统计栏里那根竖线,两侧空隙原来不一样大(左 22px / 右 8.9px);现在居中,两侧各 15px。
这根竖线是什么(定位不易)
不是文字 | —— DOM 里根本没有这个字符;.NumberBoard 和两个 item 也没有 border、
没有伪元素内容、没有背景图。最后查到 .NumberBoard-itemInner 才发现:
竖线是第二个 itemInner 的 border-left(0.93px solid),落在第二个 item 的左边界上。
| 修改前 | 修改后 | |
|---|---|---|
| 竖线到「关注者」 | 22px | 15px |
| 竖线到「被浏览」 | 8.9px | 14.9px |
改法
.NumberBoard--divider { column-gap: 7px !important; }
.NumberBoard--divider .NumberBoard-item:not(:first-child) .NumberBoard-itemInner {
padding-left: 14px !important;
}竖线移到两段文字正中,且总间距几乎不变(30.9 → 30)。
只作用于带分隔线的 .NumberBoard--divider,不影响没有竖线的 NumberBoard。
顺带:新增一个「脚本是否真的注入」体检脚本
本轮改 CSS 时踩了本项目第三次的同一个坑 —— CSS 写在脚本内的 JS 模板串里,
我在注释里写了反引号,模板串被提前闭合、整份样式注入失败,
而 node --check 照样通过(反引号成对时语法恰好合法),错误一路带到真机。
所以新增 scripts/check-injected.js:重载页面后直接查 #z2m-style 是否存在、
样式表有多少条规则,几秒钟出结果。已写进文档:改完任何 CSS 都先跑它。
回归
test-question-actions 18/18(修复前 12/18)
安装 / 更新
- 跟着更新(推荐):
https://raw.githubusercontent.com/leoshone/zhihu-desk2mob/main/zhihu-desk2mob.user.js - 或下载下方附件固定此版本
务必在打开知乎之前开启该站点的「桌面版网站」开关,否则脚本按设计不生效。
校验
f41e4d4621c0124e5c2e664174491ea9033571e0b158d6ec43a77cecc7af2c86 zhihu-desk2mob.user.js
v1.4.4 — 问题页头部的标题与描述右侧补上留白
v1.4.4 — 问题页头部的标题与描述右侧补上留白
问题页顶部的问题标题和问题描述右侧一直贴到屏幕边缘,与正文列不对齐;现在都收了 20px 回来。
根因
知乎给 .QuestionHeader-main 的 padding 左右不对称 —— 实测 0 0 0 20px(左 20、右 0)。
标签、标题、问题描述都在这层里,于是齐刷刷从 20 排到 358(屏幕右缘);
而正文列是 20..338(左右各 20px)—— 所以右边看起来「没有留白」。
改法(一处解决三处)
.QuestionHeader-main { padding-right: 20px !important; }实测(列宽 358)
| 修改前 | 修改后 | 正文列(对照) | |
|---|---|---|---|
| 标签 / 标题 / 描述 | [20, 358, 338] |
[20, 338, 318] |
[20, 338, 318] |
修改后三者与正文列完全一致。吸顶迷你头未受影响(标题仍是 [99, 229, 130])——
吸顶栏里也有 .QuestionHeader-main,已在 .PageHeader 作用域内把 padding-right 显式设回 0 覆盖。
回归
test-question-actions 18/18 · test-actions-wrap 7/7 · test-rightrail 9/9
安装 / 更新
- 跟着更新(推荐):
https://raw.githubusercontent.com/leoshone/zhihu-desk2mob/main/zhihu-desk2mob.user.js - 或下载下方附件固定此版本(脚本头带
@updateURL/@downloadURL,附件安装的同样会自动更新)
务必在打开知乎之前开启该站点的「桌面版网站」开关,否则脚本按设计不生效。
校验
5f470736bf6ecce3514ccc3425933c808cd03cca47f46e1f89165101f8f2c622 zhihu-desk2mob.user.js
v1.4.3 — 一次把「加载期闪烁」清干净
v1.4.3 — 一次把「加载期闪烁」清干净
首页加载时「发想法」按钮会先以越出屏幕的样子出现、再跳回屏内；评论框打开时「发布」按钮
和头像也有同类闪现。这一版把所有「矫正类」处理都从 300ms 去抖的定时刷新挪到
MutationObserver 回调里（微任务，跑在同一帧渲染之前），元素一出现就被改好。
根因（与 v1.4.2 同源）
这些 pass 原本只挂在 tick() 上，而 tick() 有 300ms 去抖、且每次 DOM 变动都会重置这个计时器；
页面加载 / 打开评论框时变动密集，修正被一路推迟，用户看到的就是「先错、再被纠正」。
改法
new MutationObserver(() => {
syncCommentModal(); hideCircleSync(); fitIdeaButton(); hideIdeaOption();
const btns = publishButtons();
fitPublishButton(btns); matchComposerAvatar(btns);
schedule();
});前提是每个 pass 都有廉价前置判断 —— 否则「每次 DOM 变动都跑一遍」会拖慢主线程：
| pass | 前置判断 |
|---|---|
hideCircleSync / fitIdeaButton |
.WriteArea 不存在就 return |
hideIdeaOption |
[contenteditable] 不存在就 return（其 XPath 单次 3~7ms） |
publishButtons |
本次补的：[contenteditable] 不存在就返回空数组 |
最后一条是关键：它原先要全文档扫 button（首页 125 个、单次 0.6ms），加前置后 0.1ms；
有了它，下游的「发布按钮收窄」「发布框头像缩放」才敢一起挂上来。
实测
| 指标 | 改前 | 改后 |
|---|---|---|
| 「发想法」按钮 出现→被修正（4 轮采样） | 35.7 / 39.2 / 370 / 3040 ms | 43.7 / 42.6 / 48.9 / 41.8 ms（稳定 ~43ms） |
publishButtons 单次耗时 |
0.6ms | 0.1ms |
该延迟指标本身是波动的（取决于元素恰好出现在 DOMContentLoaded 之前还是之后），
单次采样会骗人 —— 至少要采 4 轮看分布。
回归（7 套全跑，因为动的是 observer 这个公共调度层）
test-rightrail 9/9 · test-comment-back 23/23 · test-idea-option 8/8 · test-avatar 8/8 ·
test-actions-wrap 7/7 · test-question-actions 18/18
test-counterzoom 有 2 条 FAIL，但与本次改动无关：连跑三次数据一字不差，
且用旧版（v1.4.2）同样复现 —— 是「模拟捏合」在当前环境下的既有问题，已记入项目文档。
安装 / 更新
- 跟着更新（推荐）：
https://raw.githubusercontent.com/leoshone/zhihu-desk2mob/main/zhihu-desk2mob.user.js - 或下载下方附件固定此版本（脚本头带
@updateURL/@downloadURL，附件安装的同样会自动更新）
务必在打开知乎之前开启该站点的「桌面版网站」开关，否则脚本按设计不生效。
校验
7e13395c2b3f54f39e100d18eb7ceec064cedec2a199c1372f016622550e632e zhihu-desk2mob.user.js
v1.4.2 — 消除首页加载时的页面抖动
v1.4.2 — 消除首页加载时的页面抖动
首页加载时，「写想法」卡片里那个竖排的「同步到圈子」会先显示出来、随后才消失，页面跟着抖一下。
现在它在出现的同一帧内就被藏掉 —— 实测延迟从 1.8~1.9 秒降到 ~27ms。
根因
隐藏它的 hideCircleSync() 只挂在定时刷新 tick() 上，而 tick() 有 300ms 去抖 ——
更要命的是每次 DOM 变动都会重置这个计时器。首页加载期变动密集，计时器被一路推后，
真机实测延迟 1.8~1.9 秒（远不止 300ms），所以肉眼能看到明显的「闪现再消失」。
改法
把它同步挂进 MutationObserver 回调（和评论弹层用的是同一套做法，脚本里早有先例）：
new MutationObserver(() => { syncCommentModal(); hideCircleSync(); schedule(); });observer 回调是微任务，跑在同一帧渲染之前 ⇒ 元素一出现就被藏掉。
成本可控：该函数自带记忆化（circleSyncBox 仍连在 DOM 上就直接 return）+ .WriteArea 廉价前置判断。
实测（探针记录「元素出现在 DOM」与「被隐藏」的时间差）
| 出现 | 隐藏 | 延迟 | |
|---|---|---|---|
| 改前 | ~1830ms | ||
| 改后 | ~1350ms | ~1375ms | ~27ms（约一帧，人眼不可辨） |
安装 / 更新
- 跟着更新（推荐）：
https://raw.githubusercontent.com/leoshone/zhihu-desk2mob/main/zhihu-desk2mob.user.js - 或下载下方附件固定此版本（脚本头带
@updateURL/@downloadURL，附件安装的同样会自动更新）
务必在打开知乎之前开启该站点的「桌面版网站」开关，否则脚本按设计不生效。
校验
3f5b97b4df0451eac8a2e45b382b5aef55c5fb85efff15f28d0d372fd526fe2a zhihu-desk2mob.user.js
v1.4.1 — 问题页吸顶栏：标题与「关注问题」压成一行
v1.4.1 — 问题页吸顶栏：把「标题 + 关注问题」压成一行
滚动到问题页中部时，顶部那条吸顶栏原本是两行 —— 第一行问题标题（20px，被截成 6 个字），
第二行「关注问题」按钮（96×34），整条占 62px 高。现在压成一行：
知乎⟶ 一个字 ⟶如何看待人民币…⟶关注问题⟶ 一个空 ⟶头像
为什么之前压不成一行
吸顶栏 .PageHeader 宽只有 188px（左右被 logo 与头像各占约 85px），而里面是 flex-wrap: wrap；
标题不换行时自然宽 380px（20px 字号），可用内容宽只有 156px
⇒「长标题 + 96px 按钮」必然折行。实测三组方案后确认：「放在一行」这个方向本身有代价 —— 按钮占多宽，标题就少多少字。
| 方案 | 标题可见 |
|---|---|
| 强行一行、按钮不缩 | 3.4 字（比改之前还少） |
| 两行 + 都缩小 | 10.9 字（可读性最好，但不是一行） |
| 一行 + 缩小 + 左移 + 让位（采用） | 8.7 字 |
改法要点
- 覆盖
.FollowButton写死的min-width: 96px—— 不覆盖的话，字号与内边距再怎么小，按钮仍是 96px； - 清掉左内边距，标题才能贴到 logo 右侧；
padding-left: 14px再给 logo 留出一个字的空； - 吸顶栏里只留「关注问题」：隐藏「写回答」、
.QuestionHeaderActions，以及那个蓝色圆形「+」
（.SearchBar-askDropdownButton，34px，与问题页语境无关）； - 标题 20px → 15px；按钮 96×34 → 56×24；
- 按钮右推：
.QuestionHeader-side { margin-left: auto; margin-right: -20px }——
吸顶栏右缘固定在273，而头像左缘在304，只顶到容器右缘中间仍空 31px；
负右边距把按钮推出容器 20px（.PageHeader是overflow: visible，溢出不会被裁）
⇒ 按钮右端 293、距头像 11px（正好一个空）。
最终（真机 1080×2400，列宽 361）：标题 130px / 15px ≈ 8.7 字、按钮 56×24、两者同一行。
未滚动的完整标题区不受影响 —— 所有规则都限定在 .PageHeader 内，已实测确认它与页首
.QuestionHeader-footer 不是同一套 DOM。
安装 / 更新
- 跟着更新（推荐）：
https://raw.githubusercontent.com/leoshone/zhihu-desk2mob/main/zhihu-desk2mob.user.js - 或下载下方附件固定此版本（脚本头带
@updateURL/@downloadURL，附件安装的同样会自动更新）
务必在打开知乎之前开启该站点的「桌面版网站」开关，否则脚本按设计不生效。
校验
92d45a09313f36218c83bf60e6a3661d4c324c6d4d6c101fe9c68c98b0537bb2 zhihu-desk2mob.user.js
v1.4.0 — 恢复「赞同」操作栏换行（含 1.3.x 版本口径归并）
v1.4.0 — 恢复「赞同」操作栏换行（含 1.3.x 版本口径归并）
本次修复
卡片底部的「赞同 / 评论 / 收藏 / 喜欢 / 分享」操作栏在窄列里自动换行，右侧那几个按钮不再被屏幕裁掉。
此前回答页那一排只露到「赞同 7435 / 269 条评论 / 327」，后面的「137 / 分享 / ⋯」全在屏幕外 ——
而且 overflow 是 visible，滚不到也点不到。首页、关注页、专栏页同样受影响（专栏页溢出达 260px）。
根因是一次误删：.ContentItem-actions { flex-wrap: wrap } 这条规则 v1.0.0 起就一直在（原样带 row-gap: 4px），
但在 v1.3.9 被误删 —— 那一版的需求是「顶部『关注者 / 被浏览』横向排列并左对齐」（用户反馈「关注者左侧比较空」），
.NumberBoard 的新规则正好插在这条规则原来的位置上，顺手把它一起删掉了。
证据：该提交整个 diff 只删了 3 行 —— @version 一行，加上这条规则的注释与代码两行 ——
而它的 commit message 里还写着「改法（只动这一处）」。本版按 v1.3.8 的原样恢复。
顺带修正一处错误注释：v1.3.10 起 .Sticky 段写着「脚本里那条通用的 .ContentItem-actions { flex-wrap: wrap }
优先级不够」——可那条规则当时已经不存在了。这句注释把问题掩盖到了 v1.3.11，让后续两版都只在改吸底栏。
修复只动一条规则，间距与内外边距一字未改（保持知乎原样，操作栏左端仍贴着卡片边）：
.ContentItem-actions { flex-wrap: wrap !important; row-gap: 4px !important; }版本口径归并（1.3.1 ~ 1.3.12 → 1.4.0）
按项目约定，一段 patch 序列里若夹带了新行为，就在下次发布时归并成 minor。本区间含 5 处新行为：
| 主题 | 版本 |
|---|---|
| 页首按钮区排布（回到一行 / 两端贴齐正文） | 1.3.1 ~ 1.3.4 |
| 右边缘残留（首屏藏侧栏 / 专栏右栏 / 专栏正文塌陷） | 1.3.5 ~ 1.3.7 |
| 底部浮动操作栏（补满宽 / 横向铺满） | 1.3.8、1.3.10、1.3.11 |
| 顶部「关注者 / 被浏览」横向排列、左对齐 | 1.3.9 |
| 恢复卡片操作栏换行（本次修复） | 1.4.0 |
安装 / 更新
- 跟着更新（推荐）：
https://raw.githubusercontent.com/leoshone/zhihu-desk2mob/main/zhihu-desk2mob.user.js - 或下载下方附件固定此版本（脚本头带
@updateURL/@downloadURL，附件安装的同样会自动更新）
务必在打开知乎之前开启该站点的「桌面版网站」开关，否则脚本按设计不生效。
校验
6e2b0f728101ab03e017189cc48fd9c5f11a324263360006cae1f7bffdb5d4cd zhihu-desk2mob.user.js