修色板被裁切 + 让人看得出能选全色域
用户两个反馈:
① 色板直接被挡住了一半
② 它不是完全的颜色,好像只有蓝色
① 根因:色板用 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
This commit is contained in:
+1
-1
@@ -8,7 +8,7 @@ if (!defined('FB_ROOT')) {
|
||||
define('FB_ROOT', dirname(__DIR__));
|
||||
// 静态资源版本号:改 assets/ 下的 css/js 后把这个数字 +1,
|
||||
// 让浏览器与 CDN 缓存失效。全站只此一处,别再往页面里写死数字。
|
||||
if (!defined('FB_ASSET_V')) { define('FB_ASSET_V', 43); }
|
||||
if (!defined('FB_ASSET_V')) { define('FB_ASSET_V', 45); }
|
||||
}
|
||||
|
||||
/* ------------------------------------------------------------------
|
||||
|
||||
Reference in New Issue
Block a user