JQuery:根据用户的操作系统更改字体?

标签 jquery css

由于Windows不支持Helvetica,我一直在考虑使用jQuery来检测用户正在使用的操作系统,并相应地更改一些文本的字体。 这是我到目前为止编写的代码,但它似乎不起作用(操作系统已成功检测到):

<script>
        $(document).ready(function() {
            var OSName = "Unknown OS";
            if (navigator.appVersion.indexOf("Win") != -1){
                OSName = "Windows";
                $('h1').css('font-family:"Arial",sans-serif;');
            }
            else if (navigator.appVersion.indexOf("Mac") != -1)
                OSName = "MacOS";
            else if (navigator.appVersion.indexOf("X11") != -1)
                OSName = "UNIX";
            else if (navigator.appVersion.indexOf("Linux") != -1)
                OSName = "Linux";
            console.log('Operating system: ' + OSName);
        });
</script>

我想知道我是否把它放在错误的地方。我应该把它放在 <head></head> 中吗? block 或 <body></body>堵塞? 谢谢!

编辑:实际上我的服务器上有 .otf 文件并声明了 @font-face 但由于某种原因它不起作用......

        @font-face{
            font-family: HelveticaNeue-Ultralight;
            src: url('/fonts/HelveticaNeue-UltraLight.otf');
        }

最佳答案

只有部分设计师在 Windows 上安装了 Helvetica 整个包,因此您无需打扰 Windows 用户,99.8% 的用户永远不会看到 Helvetica。 一个常见的建议是首先服务 iOS,然后继续使用其他后备
在普通的 CSS font-family 中:

 "Helvetica Ultralight", "Helvetica Neue", Helvetica, Arial, sans-serif ;

另一个建议是为浏览器提供服务 with your own fonts或使用 Google-fonts 服务。
大多数设计师选择“Open Sans”作为 Helvetica 和 Arial 的现代且完美的替代品。

关于JQuery:根据用户的操作系统更改字体?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24836604/

相关文章:

php - 如何确定在 PHP else if 条件表达式中使用的输入字段类型 "submit"的当前 ID?

json - 将 fnRender 与 ajax 源数据表结合使用

边界半径内的 jQuery 动画 div。阻止边界半径在动画中丢失。 fiddle

javascript - 无法用数据填充智能菜单 jquery 网格

jquery - knockout : Why does click data-bind has execute on-load of element?

html - CSS边框问题

javascript - 2 在不同的选项卡中相互重叠的文本 JQuery-UI

html - 将 iframe 放在 div 的中心

jquery - 一个不糟糕的 Jquery 旋转器?

css - 文本类型前后的 HTML 表单空间