jQuery 控制文本框自動(dòng)縮小字體填充
更新時(shí)間：2017年06月16日 11:47:29 作者：迷失道
這篇文章主要介紹了jQuery 控制文本框自動(dòng)縮小字體填充的相關(guān)資料,需要的朋友可以參考下
js控制文本框自動(dòng)縮小字體填充，當(dāng)文本框中的字體超出文本框范圍的時(shí)候，框內(nèi)的字體會(huì)自動(dòng)縮小，以填充整個(gè)文本框;
調(diào)用：resetFontSize($(".title"), 50, 10, 20);//重置字體大小
wordbox:jQuery對(duì)象
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 () {
//循環(huán)修改大小直至大于最大高度
for (var i = minSize; i < maxSize; i++) {
if ($(this).height() > maxHeight) {
//當(dāng)容器高度大于最大高度的時(shí)候，上一個(gè)嘗試的值就是最佳大小。
$(this).css('font-size', (i - 2) + 'px');
//結(jié)束循環(huán)
break;
} else {
//如果小于最大高度，文字大小加1繼續(xù)嘗試
$(this).css('font-size', i + 'px');
}
}
});
};
以上所述是小編給大家介紹的jQuery 控制文本框自動(dòng)縮小字體填充，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
相關(guān)文章
jQuery 自動(dòng)增長的文本輸入框?qū)崿F(xiàn)代碼
文本輸入框內(nèi)的字?jǐn)?shù)不能確定，而input type="text"的size是固定的，當(dāng)字?jǐn)?shù)超過size時(shí)（默認(rèn)是20），先輸入的內(nèi)容就會(huì)從文本框的左端隱藏起來，不便于輸入。2010-04-04
jQuery實(shí)現(xiàn)一組圖片循環(huán)滾動(dòng)
這篇文章主要為大家詳細(xì)介紹了jQuery實(shí)現(xiàn)一組圖片循環(huán)滾動(dòng)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-01-01
jQuery用FormData實(shí)現(xiàn)文件上傳的方法
眾所周知文件上傳是Web開發(fā)中的重要話題，最直接和簡單的方式是通過表單直接提交文件。 下面這篇文章小編就來和大家分享jQuery利用FormData實(shí)現(xiàn)文件上傳的方法，文中介紹的方法簡單易懂，相信對(duì)大家的理解和學(xué)習(xí)很有幫助，有需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧。2016-11-11
這篇文章主要介紹了幫助你創(chuàng)建更好的jQuery插件的10條建議,涉及jQuery插件設(shè)計(jì)中常用的技巧,需要的朋友可以參考下2015-05-05
在jQuery中 關(guān)于json空對(duì)象篩選替換
本篇文章，小編將為大家介紹，在jQuery中 關(guān)于json空對(duì)象篩選替換，有需要的朋友可以參考一下2013-04-04
Jquery通過JSON字符串創(chuàng)建JSON對(duì)象
這篇文章主要介紹了Jquery如何通過JSON字符串創(chuàng)建JSON對(duì)象,并附詳細(xì)示例，需要的朋友可以參考下2014-08-08
這篇文章主要介紹了jquery為頁面增加快捷鍵的示例,需要的朋友可以參考下2014-01-01
本文詳細(xì)講解了JQuery中this的指向，文中通過示例代碼介紹的非常詳細(xì)。對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-05-05
最常見的左側(cè)分類菜單欄jQuery實(shí)現(xiàn)代碼
這篇文章主要為大家詳細(xì)介紹了最常見的左側(cè)分類菜單欄jQuery實(shí)現(xiàn)代碼,仿京東、淘寶等各大類網(wǎng)站效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-11-11
jquery實(shí)現(xiàn)圖片跟隨鼠標(biāo)的實(shí)例
這篇文章主要介紹了 jquery實(shí)現(xiàn)圖片跟隨鼠標(biāo)的實(shí)例的相關(guān)資料,希望通過本文能幫助到大家實(shí)現(xiàn)這樣的功能，需要的朋友可以參考下2017-10-10