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 相关文章推荐
JS中style属性
Oct 11 Javascript
jQuery参数列表集合
Apr 06 Javascript
JavaScript/jQuery 表单美化插件小结
Feb 14 Javascript
JavaScript设计模式之单件模式介绍
Dec 28 Javascript
Angularjs制作简单的路由功能demo
Apr 14 Javascript
纯javascript实现图片延时加载方法
Aug 21 Javascript
jquery实现的V字形显示效果代码
Oct 27 Javascript
基于javascript实现仿百度输入框自动匹配功能
Jan 03 Javascript
静态页面html中跳转传值的JS处理技巧
Jun 22 Javascript
DOM中事件处理概览与原理的全面解析
Aug 16 Javascript
JS只能输入正整数的简单实例
Oct 07 Javascript
JSON数据中存在单个转义字符“\”的处理方法
Jul 11 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
PHP中的float类型使用说明
2010/07/27 PHP
qq登录,新浪微博登录接口申请过程中遇到的问题
2014/07/22 PHP
PHP完全二叉树定义与实现方法示例
2017/10/09 PHP
19个很有用的 JavaScript库推荐
2011/06/27 Javascript
javascript 禁用IE工具栏,导航栏等等实现代码
2013/04/01 Javascript
动态加载js和css(外部文件)
2013/04/17 Javascript
js 程序执行与顺序实现详解
2013/05/13 Javascript
解析Jquery的LigerUI如何实现文件上传
2013/07/09 Javascript
JS和jquery获取各种屏幕的宽度和高度的代码
2013/08/02 Javascript
javascript中mouseover、mouseout使用详解
2015/07/19 Javascript
BootStrap 智能表单实战系列(五) 表单依赖插件处理
2016/06/13 Javascript
Bootstrap table的使用方法
2016/11/02 Javascript
微信小程序中hidden不生效原因的解决办法
2017/04/26 Javascript
JavaScript中的FileReader图片预览上传功能实现代码
2017/07/24 Javascript
Vue组件选项props实例详解
2017/08/18 Javascript
d3绘制基本的柱形图的实现代码
2018/12/12 Javascript
vue实现购物车选择功能
2020/01/10 Javascript
[04:46]2018年度玩家喜爱的电竞媒体-完美盛典
2018/12/16 DOTA
python爬虫常用的模块分析
2014/08/29 Python
python基础教程之面向对象的一些概念
2014/08/29 Python
python连接远程ftp服务器并列出目录下文件的方法
2015/04/01 Python
使用Python快速制作可视化报表的方法
2019/02/03 Python
python如何实现数据的线性拟合
2019/07/19 Python
.dcm格式文件软件读取及python处理详解
2020/01/16 Python
python目标检测给图画框,bbox画到图上并保存案例
2020/03/10 Python
Matplotlib使用Cursor实现UI定位的示例代码
2020/03/12 Python
STAY JAPAN台湾:预订日本民宿
2018/07/22 全球购物
Hotter Shoes美国官网:英国最受欢迎的舒适鞋
2018/08/02 全球购物
护士个人简历自荐信
2013/10/18 职场文书
学期研究性学习个人的自我评价
2014/01/09 职场文书
高二历史教学反思
2014/01/25 职场文书
教师自查自纠材料
2014/10/14 职场文书
地道战观后感2000字
2015/06/04 职场文书
八月迷情观后感
2015/06/11 职场文书
用几道面试题来看JavaScript执行机制
2021/04/30 Javascript
go goroutine 怎样进行错误处理
2021/07/16 Golang