推荐关注
› Meteor
› JSLint - a JavaScript code quality tool
› jsFiddle
› D3.js
› WebStorm
推荐书目
› JavaScript 权威指南第 5 版
› Closure: The Definitive Guide
xieqiqiang00

[有趣的半成品]网页字体与样式选择器

  •  
  •   xieqiqiang00 · Oct 17, 2021 · 2151 views
    This topic created in 1842 days ago, the information mentioned may be changed or developed.
    本来是想写个记事本的,但还没写完,等写完了再一起开源。

    风格上像素级模仿的 Windows 的字体选择器

    这个字体选择器可以实现:
    列出计算机中安装的字体
    检查某个字体是否有粗体或细字体(如果不支持就不会在字形中列出)
    检测字体支持哪些字符集

    https://z3.ax1x.com/2021/10/17/5tQDYV.png
    https://z3.ax1x.com/2021/10/17/5tQrWT.png
    https://z3.ax1x.com/2021/10/17/5tQBF0.png

    体验 demo:
    aHR0cHM6Ly9jZjEzMGZjMS5ub3RlcGFkLTZ6dS5wYWdlcy5kZXY=

    bit 点 ly/3jclMjo
    不知道为什么不能直接发
    codehz
    codehz
    Oct 17, 2021 via Android
    1
    这种方法似乎不能检查预定义列表之外的字体。。。。
    Chrome 貌似提供了访问本地字体列表的 api web.dev/local-fonts
    xieqiqiang00
    xieqiqiang00
    OP
    Oct 17, 2021
    2
    @codehz
    这个还没实装,如果有这种 API 我这个的确没有必要使用。
    但就算 chrome 实装了 Firefox 或者苹果那边也不可能能用。
    计算机中的字体的确只能检测到我内置的列表里的字体,但我这个表只是记录了名字,而且我使用下来效率非常高,内置的 700 多种个字体不到 100 毫秒就能检测完成,与之对比的 360 字体检测 300 种字体要好几秒才能检测完。
    而且字体的粗细和字符集判断并不是内置的。
    xieqiqiang00
    xieqiqiang00
    OP
    Oct 17, 2021
    3
    我又多测了几次,实际大概只要 50 多毫秒

    检测了 723 种字体,找到了 184 种,耗时 62ms
    检测了 723 种字体,找到了 184 种,耗时 54ms
    检测了 723 种字体,找到了 184 种,耗时 57ms
    检测了 723 种字体,找到了 184 种,耗时 54ms
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   1306 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 31ms · UTC 21:02 · PVG 05:02 · LAX 13:02 · JFK 16:02
    ♥ Do have faith in what you're doing.