使用jQuery更改基于Font-Family的Body字体大小

Question

我正在尝试使用Myriad Pro作为Arial的主要字体,例如像这样的后退:

font: 13px "Myriad Pro", "Helvetica", "Arial", "sans-serif";

我想在选择Arial或Helvetica时更改字体大小.这是我在jQuery中所拥有的,但它不起作用:

$(function(){
  if ($("body").css("font") == "Arial") {
    $("body").css("font", "10px");
};
});

我感谢你的时间,帮助和慷慨:)

Answer 1

JavaScript没有官方支持的检测字体的方法,但是这个库是一个不错的解决方法:http://www.lalit.org/lab/javascript-css-font-detect

使用此检测器,您可以使用:

$(function(){
  var fontDetector = new Detector();
  if(fontDetector.test('Arial')){
    $('body').css('font-size', '10px');
  }
});

另请注意,您只应更改font-size属性.如果更改font属性,则会覆盖字体大小和字体系列.

Answer 2

您无法检测使用什么字体来呈现文本。样式不会根据可用字体而改变。

您可以做的是测量包含文本的元素的大小，并从中推断出可以使用什么字体来呈现文本。

（另请考虑，用户对字体大小的设置也可能会影响其呈现方式。）