我需要将用户输入的文本显示到一个固定大小的div中。我想要的是自动调整字体大小,以便尽可能多地填充文本框
如果div是400px 300px。如果有人进入美国广播公司,那么它的字体真的很大。如果他们输入一个段落,那么它将是一个小字体
我可能希望从最大字体大小开始,可能是32px,当文本太大而无法容纳容器时,缩小字体大小直到合适为止
谢谢你的攻击。我想使用jQuery
你给我指出了正确的方向,这就是我的结局:
以下是该插件的链接:https://plugins.jquery.com/textfill/
和一个指向源的链接:http://jquery-textfill.github.io/
;(函数($){
$.fn.textfill=函数(选项){
var fontSize=options.maxFontPixels;
var ourText=$('span:visible:first',this);
var maxHeight=$(this).height();
var maxWidth=$(this).width();
高度;
变量文本宽度;
做{
css('font-size',fontSize);
textHeight=ourText.height();
textWidth=ourText.width();
fontSize=fontSize-1;
}而((textHeight>;maxHeight | | textWidth>;maxWidth)&;fontSize>;3);
归还这个;
}
})(jQuery);
$(文档).ready(函数(){
$('.jtextfill').textfill({maxFontPixels:36});
});
我的html是这样的
<;div class='jtextfill'style='width:100px;高度:50px;'&燃气轮机;
<;span>;我的文本在此</span>;
</部门>;
这是我的第一个jquery插件,所以它可能没有它应有的好。指针当然是受欢迎的