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 相关文章推荐
javascript英文日期(有时间)选择器
May 02 Javascript
JQuery.uploadify 上传文件插件的使用详解 for ASP.NET
Jan 22 Javascript
Javascript中找到子元素在父元素内相对位置的代码
Jul 21 Javascript
JavaScript中的acos()方法使用详解
Jun 14 Javascript
js验证真实姓名与身份证号是否匹配
Oct 13 Javascript
JavaScript实现的SHA-1加密算法完整实例
Feb 02 Javascript
Angular.Js中过滤器filter与自定义过滤器filter实例详解
May 08 Javascript
javascript 判断用户有没有操作页面
Oct 17 Javascript
vue监听对象及对象属性问题
Aug 20 Javascript
JavaScript学习笔记之图片库案例分析
Jan 08 Javascript
详解如何使用webpack打包多页jquery项目
Feb 01 jQuery
js实现扫雷源代码
Nov 27 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批量去除文件UTF8 BOM信息
2013/08/05 PHP
PHP中文编码小技巧
2014/12/25 PHP
php控制文件下载速度的方法
2015/03/24 PHP
PHP输出九九乘法表代码实例
2015/03/27 PHP
JavaScript浏览器选项卡效果
2010/08/25 Javascript
js 去除字符串第一位逗号的方法
2014/06/07 Javascript
JavaScript设计模式之单件模式介绍
2014/12/28 Javascript
充分发挥Node.js程序性能的一些方法介绍
2015/06/23 Javascript
初步了解javascript面向对象
2015/11/09 Javascript
轻量级jQuery插件slideBox实现带底栏轮播(焦点图)代码
2016/03/28 Javascript
详解AngularJs中$resource和restfu服务端数据交互
2016/09/21 Javascript
javascript实现Java中的Map对象功能的实例详解
2017/08/21 Javascript
JS中Attr的用法详解
2017/10/09 Javascript
js中apply()和call()的区别与用法实例分析
2018/08/14 Javascript
微信小程序scroll-view横向滑动嵌套for循环的示例代码
2018/09/20 Javascript
详解项目升级到vue-cli3的正确姿势
2019/01/28 Javascript
vue实现Excel文件的上传与下载功能的两种方式
2019/06/28 Javascript
js对象数组和对象的使用实例详解
2019/08/27 Javascript
[42:00]完美世界DOTA2联赛PWL S3 Phoenix vs INK ICE 第一场 12.13
2020/12/17 DOTA
Python实现的数据结构与算法之基本搜索详解
2015/04/22 Python
python通过ssh-powershell监控windows的方法
2015/06/02 Python
Python中实现变量赋值传递时的引用和拷贝方法
2018/04/29 Python
Python3匿名函数lambda介绍与使用示例
2019/05/18 Python
如何使用Python多线程测试并发漏洞
2019/12/18 Python
关于tensorflow的几种参数初始化方法小结
2020/01/04 Python
在tensorflow中设置使用某一块GPU、多GPU、CPU的操作
2020/02/07 Python
java字符串格式化输出实例讲解
2021/01/06 Python
Html5 语法与规则简要概述
2014/07/29 HTML / CSS
ProBikeKit德国:在线公路自行车专家
2018/06/03 全球购物
俄罗斯花园种植材料批发和零售网上商店:Беккер
2019/07/22 全球购物
含精油的天然有机化妆品:Indemne
2019/08/27 全球购物
自我鉴定模板
2013/10/29 职场文书
详细的大学生创业计划书模板
2014/01/27 职场文书
新员工试用期自我鉴定
2014/04/17 职场文书
音乐课外活动总结
2015/05/09 职场文书
海康机器人重磅发布全新算法开发平台VM4.2
2022/04/21 数码科技