一行 JS 打开屏幕拾色器

2022-01-25 11:22:36 +08:00
 iqoo
open('','','width=1,height=1').document.write('<input type=color>')

点击颜色控件,点击钢笔图标,可在屏幕上取色。按空格可在圈圈中实时显示当前颜色。

当然远没有系统自带的方便~

2693 次点击
所在节点    分享创造
7 条回复
nanvon
2022-01-25 14:09:51 +08:00
可以把代码加到 javascript ()内,添加到收藏夹
iMusic
2022-01-25 18:54:51 +08:00
哈哈哈 简直棒呆了
muhuan
2022-01-26 08:08:55 +08:00
厉害
mscststs
2022-01-26 13:33:49 +08:00
```
javascript:(()=>{let d = document; let s=d.createElement("input");s.style="display:none";s.type="color";d.body.appendChild(s);s.click();s.oninput=(e)=>{navigator.clipboard.writeText(e.target.value);d.body.removeChild(s)};})();
```

添加到收藏夹,取色后自动拷贝到剪贴板。

仅在 Edge 上调试通过,其他浏览器不知道
iqoo
2022-01-27 11:36:19 +08:00
@mscststs 元素不用添加到文档,直接在内存里 click 就可以

let s = document.createElement('input')
s.type = 'color'
s.click()
iqoo
2022-01-27 11:39:15 +08:00
@mscststs 不过 chromium 的弹出的颜色面板没法拖动,取不到面板后面的颜色。所以才用 open 弹窗,面板可以跟随小窗口移动。
mscststs
2022-05-13 10:58:59 +08:00
对于 Edge > 95 和 Chrome > 95 ,亦可使用以下代码
```
javascript:(async ()=>{navigator.clipboard.writeText((await (new EyeDropper()).open()).sRGBHex);})();
```

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/830446

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX