jQuery实现自动调整字体大小的方法


Posted in Javascript onJune 15, 2015

本文实例讲述了jQuery实现自动调整字体大小的方法。分享给大家供大家参考。具体分析如下:

这里使用一个jQuery函数,自动更改元素中的文本的字体大小。

$.fn.fontfit = function(max) {
  var max_size = 18;
  if (typeof(max) == "undefined")
    max = max_size;
  $(this).wrapInner('<div id="fontfit"></div>');
  var dheight = $(this).height();
  var cheight = $("#fontfit").height();
  var fsize = (($(this).css("font-size")).slice(0,-2))*1;
  while(cheight<dheight && fsize<max) {
    fsize+=1;
    $(this).css("font-size",fsize+"px");
    cheight = $("#fontfit").height();
  }
  while(cheight>dheight || fsize>max) {
    fsize-=1;
    $(this).css("font-size",fsize+"px");
    cheight = $("#fontfit").height();
  }
  $("#fontfit").replaceWith($("#fontfit").html());
  return this;
}

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
国外大牛IE版本检测!现在IE都到9了,IE检测代码
Jan 04 Javascript
判断对象是否Window的实现代码
Jan 10 Javascript
jQuery中选择器小问题(新人难免遇到)
Mar 31 Javascript
JavaScript中Date.toSource()方法的使用教程
Jun 12 Javascript
JS给Textarea文本框添加行号的方法
Aug 20 Javascript
分享有关jQuery中animate、slide、fade等动画的连续触发、滞后反复执行的bug
Jan 10 Javascript
Bootstrap4一次重大更新 几乎涉及每行代码
May 16 Javascript
微信小程序(六):列表上拉加载下拉刷新示例
Jan 13 Javascript
jQuery插件FusionCharts绘制2D双折线图效果示例【附demo源码】
Apr 14 jQuery
详解Angular 4.x NgTemplateOutlet
May 24 Javascript
使用bootstrap实现下拉框搜索功能的实例讲解
Aug 10 Javascript
Vue3 中的数据侦测的实现
Oct 09 Javascript
JavaScript中使用指数方法Math.exp()的简介
Jun 15 #Javascript
Jquery简单实现GridView行高亮的方法
Jun 15 #Javascript
简介JavaScript中Math.cos()余弦方法的使用
Jun 15 #Javascript
JavaScript中的Math.atan2()方法使用详解
Jun 15 #Javascript
浅谈JavaScript中的Math.atan()方法的使用
Jun 14 #Javascript
JavaScript中反正弦函数Math.asin()的使用简介
Jun 14 #Javascript
JavaScript中的acos()方法使用详解
Jun 14 #Javascript
You might like
饭制《星际争霸》Mod:优化游戏机制 增加新单位
2017/07/02 星际争霸
PHP简洁函数小结
2011/08/12 PHP
ThinkPHP文件上传实例教程
2014/08/22 PHP
Linux下安装PHP MSSQL扩展教程
2014/10/24 PHP
Yii框架表单模型和验证用法
2016/05/20 PHP
PHP实现按之字形顺序打印二叉树的方法
2018/01/16 PHP
科讯商业版中用到的ajax空间与分页函数
2007/09/02 Javascript
js select常用操作控制代码
2010/03/16 Javascript
基于jquery的DIV随滚动条滚动而滚动的代码
2012/07/20 Javascript
Javascript图像处理—亮度对比度应用案例
2013/01/03 Javascript
纯JavaScript实现HTML5 Canvas六种特效滤镜示例
2013/06/28 Javascript
javascript loadScript异步加载脚本示例讲解
2013/11/14 Javascript
利用jquery实现验证输入的是否是数字、小数,包含保留几位小数
2016/12/07 Javascript
smartupload实现文件上传时获取表单数据(推荐)
2016/12/12 Javascript
使用vs code开发Nodejs程序的使用方法
2017/09/21 NodeJs
bootstrap table实现双击可编辑、添加、删除行功能
2017/09/27 Javascript
vue的过滤器filter实例详解
2018/09/17 Javascript
微信小程序实现渐入渐出动画效果
2019/06/13 Javascript
nodejs二进制与Buffer的介绍与使用
2019/07/11 NodeJs
小程序如何在不同设备上自适应生成海报的实现方法
2019/08/20 Javascript
JavaScript RegExp 对象用法详解
2019/09/24 Javascript
ES6的异步操作之promise用法和async函数的具体使用
2019/12/06 Javascript
Python实现配置文件备份的方法
2015/07/30 Python
Python中static相关知识小结
2018/01/02 Python
基于循环神经网络(RNN)实现影评情感分类
2018/03/26 Python
python 利用栈和队列模拟递归的过程
2018/05/29 Python
python实现多层感知器MLP(基于双月数据集)
2019/01/18 Python
用Python获取摄像头并实时控制人脸的实现示例
2019/07/11 Python
Django实现基于类的分页功能
2019/10/31 Python
Python进行统计建模
2020/08/10 Python
Python装饰器如何实现修复过程解析
2020/09/05 Python
斯洛伐克电子产品购物网站:DATART
2020/04/05 全球购物
2014镇党委班子对照检查材料思想汇报
2014/09/23 职场文书
后天观后感
2015/06/08 职场文书
春风化雨观后感
2015/06/11 职场文书
Spring Bean的实例化之属性注入源码剖析过程
2021/06/13 Java/Android