jQuery 控制div框自动缩小字体避免换行

另外：jquery-textfill这个插件也可以实现，http://jquery-textfill.github.io/

JS控制div框自动缩小字体填充，当div框中的字体超出div框范围的时候，框内的字体会自动缩小，以填充整个文本框;

调用：resetFontSize($(".title"), 50, 10, 20);//重置字体大小 

wordbox:jquery对象

maxHeight:box的最大高度

minSize:最小字体大小

maxSize:最大字体大小

[javascript]  view plain  copy

1. this.resetFontSize=function (wordbox, maxHeight, minSize, maxSize) {  
2.         //   var wordbox = $(".products .title");  
3.         //最大高度  
4.         //var maxHeight = 30;  
5.         //初始化文字大小为最小  
6.         wordbox.css('font-size', minSize + "px");  
7.         maxSize++;  
8.         wordbox.each(function () {  
9.             //循环修改大小直至大于最大高度  
10.             for (var i = minSize; i < maxSize; i++) {  
11.                 if ($(this).height() > maxHeight) {  
12.                     //当容器高度大于最大高度的时候，上一个尝试的值就是最佳大小。  
13.                     $(this).css('font-size', (i - 2) + 'px');  
14.                     //结束循环  
15.                     break;  
16.                 } else {  
17.                     //如果小于最大高度，文字大小加1继续尝试  
18.                     $(this).css('font-size', i + 'px');  
19.                 }  
20.             }  
21.         });  
22.     };