jQuery 控制文本框自动缩小字体填充
更新时间：2017年06月16日 11:47:29 作者：迷失道
这篇文章主要介绍了jQuery 控制文本框自动缩小字体填充的相关资料,需要的朋友可以参考下
js控制文本框自动缩小字体填充，当文本框中的字体超出文本框范围的时候，框内的字体会自动缩小，以填充整个文本框;
调用：resetFontSize($(".title"), 50, 10, 20);//重置字体大小
wordbox:jQuery对象
maxHeight:box的最大高度
minSize:最小字体大小
maxSize:最大字体大小
this.resetFontSize=function (wordbox, maxHeight, minSize, maxSize) {
// var wordbox = $(".products .title");
//最大高度
//var maxHeight = 30;
//初始化文字大小为最小
wordbox.css('font-size', minSize + "px");
maxSize++;
wordbox.each(function () {
//循环修改大小直至大于最大高度
for (var i = minSize; i < maxSize; i++) {
if ($(this).height() > maxHeight) {
//当容器高度大于最大高度的时候，上一个尝试的值就是最佳大小。
$(this).css('font-size', (i - 2) + 'px');
//结束循环
break;
} else {
//如果小于最大高度，文字大小加1继续尝试
$(this).css('font-size', i + 'px');
}
}
});
};
以上所述是小编给大家介绍的jQuery 控制文本框自动缩小字体填充，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
相关文章
文本输入框内的字数不能确定，而input type="text"的size是固定的，当字数超过size时（默认是20），先输入的内容就会从文本框的左端隐藏起来，不便于输入。2010-04-04
这篇文章主要为大家详细介绍了jQuery实现一组图片循环滚动，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-01-01
众所周知文件上传是Web开发中的重要话题，最直接和简单的方式是通过表单直接提交文件。 下面这篇文章小编就来和大家分享jQuery利用FormData实现文件上传的方法，文中介绍的方法简单易懂，相信对大家的理解和学习很有帮助，有需要的朋友们下面来一起学习学习吧。2016-11-11
这篇文章主要介绍了帮助你创建更好的jQuery插件的10条建议,涉及jQuery插件设计中常用的技巧,需要的朋友可以参考下2015-05-05
本篇文章，小编将为大家介绍，在jQuery中 关于json空对象筛选替换，有需要的朋友可以参考一下2013-04-04
这篇文章主要介绍了Jquery如何通过JSON字符串创建JSON对象,并附详细示例，需要的朋友可以参考下2014-08-08
这篇文章主要介绍了jquery为页面增加快捷键的示例,需要的朋友可以参考下2014-01-01
本文详细讲解了JQuery中this的指向，文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2022-05-05
这篇文章主要为大家详细介绍了最常见的左侧分类菜单栏jQuery实现代码,仿京东、淘宝等各大类网站效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-11-11
这篇文章主要介绍了 jquery实现图片跟随鼠标的实例的相关资料,希望通过本文能帮助到大家实现这样的功能，需要的朋友可以参考下2017-10-10
最新评论