laoyang
a2a3306169
修色板被裁切 + 让人看得出能选全色域
用户两个反馈:
① 色板直接被挡住了一半
② 它不是完全的颜色,好像只有蓝色
① 根因:色板用 position:absolute,而它在
<details class="tax-form-box"> 里面,那个容器有 overflow:hidden。
色相条正好在面板最底部 —— 被裁掉了,所以看不见。
改 position:fixed,直接相对视口定位,任何祖先 overflow 都管不到。
位置改由 JS 按触发按钮坐标算,并处理三种情况:
右边超出→左移;下方不够→翻上方;都放不下→贴视口底边
另加 resize/scroll 监听,避免滚动后色板漂走。
② 不是 bug,是 ① 的连带后果:
HSV 色板本来就只显示当前色相的深浅变化,换颜色靠色相条。
色相条被裁掉后,用户只看到一片蓝,自然以为只有蓝色。
修好裁切后已实测 6 个色相各不相同:
0°红 60°黄 120°绿 180°青 240°蓝 300°品红
同时把色相条从 14px 加高到 18px 并加内描边,
让它一眼就能认出是光谱条,而不是一条灰线。
验证(用真实后台容器结构复刻测试页,details 带 overflow:hidden):
面板四边 elementFromPoint 都能命中自己 → 未被任何容器裁切
色相条可见、高 18px;面板总高 367px
滚到页面底部再开面板仍完整可见
6 个色相取样互不相同,色板能覆盖全色域
实际取色 #0ce779 正常
4 个路由 200
2026-11-04 19:01:04 +08:00
..
2026-11-04 18:57:18 +08:00
2026-11-03 08:27:03 +08:00
2026-11-04 19:01:04 +08:00
2026-09-28 20:34:37 +08:00
2026-11-03 09:54:12 +08:00
2026-11-03 21:11:51 +08:00
2026-11-03 10:48:07 +08:00
2026-11-03 07:21:04 +08:00
2026-11-04 17:54:39 +08:00