相关疑难解决方法(0)

如何使用JavaScript检测Safari浏览器？我在下面尝试了代码,它不仅可以检测Safari,还可以检测Chrome浏览器.

function IsSafari() {

  var is_safari = navigator.userAgent.toLowerCase().indexOf('safari/') > -1;
  return is_safari;

}

我在OS X 10.10.3上运行Safari 8.0.5.

每当使用彼此相邻的字符"f"和"i"时,我就遇到了字母间距问题.我的猜测是这是一个Safari漏洞,我已经将它提交给了苹果公司,但也希望看看我是否能在同一时间找到解决方法.

HTML以两种不同的字体输出短语"鱼很大".为了突出这个问题,我在每个字符之间添加了10px的字母间距.

HTML:

<div class="p1">
    The fish is large
</div>
<div class="p2">
    The fish is large
</div>

CSS:

div { letter-spacing: 10px; margin-bottom: 10px; }

div.p1 { 
    color: #009900;
    font-family: Helvetica;
}
div.p2 {
    color: #000099;
    font-family: Arial;
}

这就是我在Safari中输出的内容:

出于测试目的,我在"f"和"i"字符之间添加了HTML注释,这似乎有效:

<div class="p1">
    The f<!----->ish is large
</div>

像这样输出:

虽然这在技术上有效,但它对我来说并不是一个理想的解决方案,因为这里的内容实际上是由WYSIWYG编辑器生成的.

似乎只有在"f"和"i"彼此相邻时才会出现问题.我不确定这些字母在Safari中是否具有特殊含义,但它是英语中非常常见的字母序列,所以它们真的不应该有这么小的关键字.

我也尝试添加这个:

 -webkit-font-feature-settings: "kern";

这确实推动了"s"向右推进,但"f"和"i"仍然聚集在一起.

大写的"F"没有同样的问题:

而"fi"之后的角色似乎并不重要.我可以将其改为其他任何东西,它仍然有同样的问题.

如果"fi"出现在中间词中,它也会做同样的事情:

我已经确认这个问题似乎也存在于运行最新版Safari的iPhone 6 Plus上,所以我怀疑它只是我的最终目的.

为了说明这个问题,我创建了一个jsfiddle,其中包含必要的HTML和CSS,希望能够在您的最终重现该问题. https://jsfiddle.net/38keruv7/4/

有没有人想要一个解决方法,不涉及要求我的客户在WYSIWYG编辑器中插入HTML注释？

我想我可以在输出数据之前扫描并替换该特定组合,但在处理更大的数据块时,这似乎是对服务器资源的相当低效的使用.