jQuery 控制文本框自动缩小字体填充


Posted in jQuery onJune 16, 2017

 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 控制文本框自动缩小字体填充,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

jQuery 相关文章推荐
jQuery实现简单漂亮的Nav导航菜单效果
Mar 29 jQuery
jquery实现tab选项卡切换效果(悬停、下方横线动画位移)
May 05 jQuery
jquery实现下拉菜单的手风琴效果
Jul 23 jQuery
jQuery发请求传输中文参数乱码问题的解决方案
May 22 jQuery
浅谈JS和jQuery的区别
Mar 27 jQuery
详解jQuery中的getAll()和cleanData()
Apr 15 jQuery
jquery插件开发模式实例详解
Jul 20 jQuery
jQuery模仿ToDoList实现简单的待办事项列表
Dec 30 jQuery
jQuery实现的移动端图片缩放功能组件示例
May 01 jQuery
jQuery HTML css()方法与css类实例详解
May 20 jQuery
JQuery绑定事件四种实现方法解析
Dec 02 jQuery
jQuery实现简单弹幕制作
Dec 10 jQuery
jQuery序列化后的表单值转换成Json
Jun 16 #jQuery
基于jQuery和CSS3实现APPLE TV海报视差效果
Jun 16 #jQuery
利用jquery去掉时光轴头尾部线条的方法实例
Jun 16 #jQuery
jQuery实现 RadioButton做必选校验功能
Jun 15 #jQuery
jQuery ajax动态生成table功能示例
Jun 14 #jQuery
jQuery.form.js的使用详解
Jun 14 #jQuery
jQueryeasyui 中如何使用datetimebox 取两个日期间相隔的天数
Jun 13 #jQuery
You might like
咖啡冲泡指南 咖啡有哪些制作方式 单品咖啡 意式咖啡
2021/03/06 冲泡冲煮
php 静态变量的初始化
2009/11/15 PHP
PHP父类调用子类方法的代码例子
2014/04/09 PHP
php递归法读取目录及文件的方法
2015/01/30 PHP
Opcache导致php-fpm崩溃nginx返回502
2015/03/02 PHP
ucenter中词语过滤原理分析
2016/07/13 PHP
JSON 编辑器实现代码
2009/12/06 Javascript
javascript 动态生成私有变量访问器
2009/12/06 Javascript
不要在cookie中使用特殊字符的原因分析
2010/07/13 Javascript
extjs 3.31 TreeGrid实现静态页面加载json到TreeGrid里面
2013/04/02 Javascript
jquery为页面增加快捷键示例
2014/01/31 Javascript
javascript与jquery动态创建html元素示例
2016/07/25 Javascript
详解jQuery插件开发方式
2016/11/22 Javascript
nodejs开发——express路由与中间件
2017/03/24 NodeJs
使用JavaScript根据图片获取条形码的方法
2017/07/04 Javascript
解决vue点击控制单个样式的问题
2018/09/05 Javascript
浅谈JavaScript_DOM学习篇_图片切换小案例
2019/03/19 Javascript
layui问题之模拟table表格中的选中按钮选中事件的方法
2019/09/20 Javascript
Python的Django框架中模板碎片缓存简介
2015/07/24 Python
玩转python爬虫之正则表达式
2016/02/17 Python
20个常用Python运维库和模块
2018/02/12 Python
OPENCV去除小连通区域,去除孔洞的实例讲解
2018/06/21 Python
python opencv实现旋转矩形框裁减功能
2018/07/25 Python
Django+Xadmin构建项目的方法步骤
2019/03/06 Python
python3中类的继承以及self和super的区别详解
2019/06/26 Python
python 环境搭建 及python-3.4.4的下载和安装过程
2019/07/20 Python
巴西最大的珠宝连锁店:Vivara
2019/04/18 全球购物
加拿大服装和鞋类零售商:Mark’s
2021/01/04 全球购物
办护照工作证明范本
2014/01/14 职场文书
《一本男孩子必读的书》教学反思
2014/02/19 职场文书
2014年国庆节广播稿
2014/09/19 职场文书
群众路线教育实践活动对照检查材料
2014/09/22 职场文书
学校党员个人问题整改措施思想汇报
2014/10/08 职场文书
机关班子查摆问题及整改措施
2014/10/28 职场文书
银行自荐信怎么写
2015/03/05 职场文书
初二英语教学反思
2016/02/15 职场文书