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 相关文章推荐
网页常用特效代码整理
Jun 23 Javascript
Javascript中的相等与不等运算
Apr 25 Javascript
如何将JS的变量值传递给ASP变量
Dec 10 Javascript
JQ实现新浪游戏首页幻灯片
Jul 29 Javascript
javascript弹出窗口中增加确定取消按钮
Jun 24 Javascript
利用Angularjs实现幻灯片效果
Sep 07 Javascript
jQuery插入节点和移动节点用法示例(insertAfter、insertBefore方法)
Sep 08 Javascript
AngularJS实现表单验证功能
Jan 09 Javascript
jquery仿微信聊天界面
May 06 jQuery
js学习总结_轮播图之渐隐渐现版(实例讲解)
Jul 17 Javascript
PostgreSQL Node.js实现函数计算方法示例
Feb 12 Javascript
vue百度地图 + 定位的详解
May 13 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中循环语句的用法介绍
2012/01/30 PHP
PHP实现加密的几种方式介绍
2015/02/22 PHP
php反射学习之依赖注入示例
2019/06/14 PHP
laravel框架数据库操作、查询构建器、Eloquent ORM操作实例分析
2019/12/20 PHP
php获取小程序码的实现代码(B类接口)
2020/06/13 PHP
javascript 写类方式之十
2009/07/05 Javascript
jquery实现保存已选用户
2014/07/21 Javascript
JavaScript获得url查询参数的方法
2015/07/02 Javascript
基于jQuery实现的扇形定时器附源码下载
2015/10/20 Javascript
angularjs 中$apply,$digest,$watch详解
2016/10/13 Javascript
利用jquery获取select下拉框的值
2016/11/23 Javascript
javascript实现鼠标点击页面 移动DIV
2016/12/02 Javascript
基于jQuery的左滑出现删除按钮的示例
2017/08/29 jQuery
Vue中添加手机验证码组件功能操作方法
2017/12/07 Javascript
nodejs遍历文件夹下并操作HTML/CSS/JS/PNG/JPG的方法
2018/11/01 NodeJs
Vue路由的模块自动化与统一加载实现
2020/06/05 Javascript
Python内建数据结构详解
2016/02/03 Python
PHP网页抓取之抓取百度贴吧邮箱数据代码分享
2016/04/13 Python
python使用tensorflow保存、加载和使用模型的方法
2018/01/31 Python
pandas groupby 分组取每组的前几行记录方法
2018/04/20 Python
python根据list重命名文件夹里的所有文件实例
2018/10/25 Python
flask应用部署到服务器的方法
2019/07/12 Python
python实现抠图给证件照换背景源码
2019/08/20 Python
Python爬取腾讯视频评论的思路详解
2019/12/19 Python
python3 Scrapy爬虫框架ip代理配置的方法
2020/01/17 Python
详解matplotlib中pyplot和面向对象两种绘图模式之间的关系
2021/01/22 Python
谈一谈HTML5本地存储技术
2016/03/02 HTML / CSS
Canvas实现保存图片到本地的示例代码
2018/06/28 HTML / CSS
美国最古老的精致书写工具制造商:A.T. Cross(高仕)
2018/01/30 全球购物
英国时尚泳装品牌:Maru Swimwear
2019/10/06 全球购物
英国No.1体育用品零售商:SportsDirect.com
2019/10/16 全球购物
写一个函数返回1+2+3+…+n的值(假定结果不会超过长整型变量的范围)
2014/09/05 面试题
《燕子专列》教学反思
2014/02/21 职场文书
感恩小明星事迹材料
2014/05/23 职场文书
团队口号大全
2014/06/06 职场文书
2015年药店工作总结
2015/04/20 职场文书