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 Plupload上传插件的使用
Apr 19 jQuery
jquery+css实现侧边导航栏效果
Jun 12 jQuery
js案例之鼠标跟随jquery版(实例讲解)
Jul 21 jQuery
jQuery中的类名选择器(.class)用法简单示例
May 14 jQuery
jQuery创建及操作xml格式数据示例
May 26 jQuery
jQuery实现炫丽的3d旋转星空效果
Jul 04 jQuery
jquery实现搜索框功能实例详解
Jul 23 jQuery
jQuery实现上下滚动公告栏详细代码
Nov 21 jQuery
Jquery获取radio选中值实例总结
Jan 17 jQuery
基于jQuery的时间戳与日期间的转化
Jun 21 jQuery
jQuery利用cookie 实现本地收藏功能(不重复无需多次命名)
Nov 07 jQuery
jQuery+ThinkPHP实现图片上传
Jul 23 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
php学习笔记 PHP面向对象的程序设计
2011/06/13 PHP
PHP session会话的安全性分析
2011/09/08 PHP
typecho插件编写教程(三):保存配置
2015/05/28 PHP
初识通用数据库操作类――前端easyui-datagrid,form(php)
2015/07/31 PHP
JS location几个方法小姐
2008/07/09 Javascript
JavaScript学习点滴 call、apply的区别
2010/10/22 Javascript
jQuery EasyUI API 中文文档 DateTimeBox日期时间框
2011/10/16 Javascript
js 自制滚动条的小例子
2013/03/16 Javascript
js的Prototype属性解释及常用方法
2014/05/08 Javascript
jQuery获取cookie值及删除cookie用法实例
2016/04/15 Javascript
jquery层级选择器(匹配父元素下的子元素实现代码)
2016/09/05 Javascript
关于HTTP传输中gzip压缩的秘密探索分析
2018/01/12 Javascript
如何手动实现es5中的bind方法详解
2018/12/07 Javascript
JavaScript中.min.js和.js文件的区别讲解
2019/02/13 Javascript
微信小程序中button去除默认的边框实例代码
2019/08/01 Javascript
JS canvas实现画板和签字板功能
2021/02/23 Javascript
Python爬虫_城市公交、地铁站点和线路数据采集实例
2018/01/10 Python
详解Python requests 超时和重试的方法
2018/12/18 Python
使用TensorFlow实现二分类的方法示例
2019/02/05 Python
Python读写文件基础知识点
2019/06/10 Python
Python替换NumPy数组中大于某个值的所有元素实例
2020/06/08 Python
Python sqlalchemy时间戳及密码管理实现代码详解
2020/08/01 Python
html5菜单折纸效果
2014/04/22 HTML / CSS
一些PHP的面试题
2015/05/06 面试题
老师推荐信
2013/10/28 职场文书
办公室内勤工作职责
2013/12/11 职场文书
会计出纳员的自我评价
2014/01/15 职场文书
运动会通讯稿400字
2014/01/28 职场文书
语文教育专业求职信
2014/06/28 职场文书
未婚证明书模板
2014/10/08 职场文书
欢迎词怎么写
2015/01/23 职场文书
会议通知格式范文
2015/04/15 职场文书
因身体原因离职的辞职信范文
2015/05/12 职场文书
跳高加油稿
2015/07/21 职场文书
实现一个简单得数据响应系统
2021/11/11 Javascript
Windows Server 2012配置DNS服务器的方法
2022/04/29 Servers