jQuery.fontFlex是一款轻量级jQuery响应式字体插件。它可以在浏览器或容器的尺寸发生改变时动态修改字体的大小，适合于在各种响应式布局中显示文字。

使用方法

使用该响应式字体插件需要在页面中引入jquery和jQuery.fontFlex.js文件。

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jQuery.fontFlex.js"></script>
初始化插件

你可以首先在CSS文件中为<body>元素定义字体大小和行高，例如font-size:1em;line-height:150%;。如果浏览器被禁用了javascript，页面中的字体使用CSS设置的大小和行高。然后你可以通过该插件来制作字体的响应式效果，在页面DOM元素加载完毕之后，通过fontFlex()方法来初始化该响应式字体插件。

$(function() {

  // 所有元素
  $('body').fontFlex(14, 20, 70);

  // H1元素
  $('h1').fontFlex(24, 36, 70); 

});

配置参数

jQuery.fontFlex响应式字体插件有3个可用的配置参数：

  • min：最小的font-size，单位像素。
  • max：最大的font-size，单位像素。
  • mid：范围缓冲区，设置在60-70之间效果最佳。值越小产生的字体越大，反之字体越小，可以根据实际情况来调整这个参数。

浏览器兼容

jQuery.fontFlex响应式字体插件可以在以下浏览器中正常工作：

  • Google Chrome
  • Safari ( 桌面和移动手机 )
  • Internet Explorer ( 8, 9, 10+ )
  • Firefox

jQuery.fontFlex响应式字体插件的github地址为：https://github.com/nathco/jQuery.fontFlex