zoukankan      html  css  js  c++  java
  • JS jQuery查看系统中安装的字体

    1.下载插件:FontDetect插件  地址:http://www.lalit.org/lab/javascript-css-font-detect/

    或者复制以下代码到fontdetect.js:

    var Detector = function() {
        // a font will be compared against all the three default fonts.
        // and if it doesn't match all 3 then that font is not available.
        var baseFonts = ['monospace', 'sans-serif', 'serif'];

        //we use m or w because these two characters take up the maximum width.
        // And we use a LLi so that the same matching fonts can get separated
        var testString = "mmmmmmmmmmlli";

        //we test using 72px font size, we may use any size. I guess larger the better.
        var testSize = '72px';

        var h = document.getElementsByTagName("body")[0];

        // create a SPAN in the document to get the width of the text we use to test
        var s = document.createElement("span");
        s.style.fontSize = testSize;
        s.innerHTML = testString;
        var defaultWidth = {};
        var defaultHeight = {};
        for (var index in baseFonts) {
            //get the default width for the three base fonts
            s.style.fontFamily = baseFonts[index];
            h.appendChild(s);
            defaultWidth[baseFonts[index]] = s.offsetWidth; //width for the default font
            defaultHeight[baseFonts[index]] = s.offsetHeight; //height for the defualt font
            h.removeChild(s);
        }

        function detect(font) {
            var detected = false;
            for (var index in baseFonts) {
                s.style.fontFamily = font + ',' + baseFonts[index]; // name of the font along with the base font for fallback.
                h.appendChild(s);
                var matched = (s.offsetWidth != defaultWidth[baseFonts[index]] || s.offsetHeight != defaultHeight[baseFonts[index]]);
                h.removeChild(s);
                detected = detected || matched;
            }
            return detected;
        }

        this.detect = detect;
    };

    2.页面调用方法

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="UTF-8">
        <script type="text/javascript" src="js/fontdetect.js"></script>
        <script type="text/javascript">
            window.onload = function() {
                var detective = new Detector();
                alert(detective.detect('方正兰亭准黑简体'));
            };
        </script>
    </head>
    <body>
    </body>
    </html>

  • 相关阅读:
    PHP 缓存技术
    redis雪崩
    【Redis】- 缓存击穿
    Memcache 与 Memcached 的区别
    数据库设计:范式与反范式
    Thinkphp5多数据库切换
    PHP 分布式集群中session共享问题以及session有效期的设置
    Nginx使用upstream实现动静分离
    rsync 服务快速部署手册
    tp5 为什么使用单例模式
  • 原文地址:https://www.cnblogs.com/myphper/p/3946338.html
Copyright © 2011-2022 走看看