网页常常有对字体放大缩小的需求,我们不妨来看一下下面这段JQuery代码的实现。

假如在html页面代码中我们有这么一段代码:

<p>啦啦啦啦啦啦啦啦啦啦</p>

那么JQuery的实现如下

$(document).ready(function () {
var fontSize = $("p").css("font-size");
//取得当前字体大小
var fontSizeNumber = parseFloat(fontSize , 10);
//取得单位
var unit = size.slice(-2);
//放大字体,bigFontSize为按钮id
$("#bigFontSize").click(function () {
fontSizeNumber += 2;
$("p").css("font-size", fontSizeNumber + unit);
});
//减小字体,smallFontSize为按钮id
$("#smallFontSize").click(function () {
fontSizeNumber -= 2;
$("p").css("font-size", fontSizeNumber + unit);
});
});

JQuery实现最字体的放大缩小的更多相关文章

  1. kotlin3-IdeaIU编辑器字体自动放大缩小

  2. 如何让vim像IDE一样一键放大缩小字号?

    原创,转载请注明出处 在其他IDE中,比如codeblocks,按住ctrl,然后滑动鼠标滚轮就可以实现字体的放大缩小. 在强大的vim中code怎么能缺少这种功能?! 在vim插件库中查询一番,发现 ...

  3. [jQuery]地图浏览:如何实现图片的放大缩小和点击之后的位置居中

    HTML代码: <!DOCTYPE html> <html> <head> <script src="http://ajax.googleapis. ...

  4. jquery 实现点击图片居住放大缩小

    该功能是基于jquery实现的,所以 第一步则是引入jquery jquery下载地址:https://jquery.com/download/ 或者使用此时调试的版本(3版本) /*! jQuery ...

  5. jQuery控制网页字体大小和肤色

    在一些网站上经常看到有控制网页肤色和字体大小的功能,接下来,我们将用两个例子来实现这两个功能. 网页字体大小 首先我们在网页中添加一些被控制大小的文字和字体控制的按钮. <!DOCTYPE> ...

  6. HTML5 canvas处理图片的各种效果,包括放大缩小涂鸦等

    http://www.htmleaf.com/ziliaoku/qianduanjiaocheng/201502151385.html jQuery 缩放 旋转 裁剪图片 Image Cropper ...

  7. Canvas实现图片放大缩小移动操作

    对于HTML5相信大家都不陌生,很早就出来了,但是貌似都没有真正的使用过.最近做项目时要实现这样一个需求:一个图片,大小不固定,要求能实现类似地图一样放大.缩小.移动功能.这里就很合适使用html5的 ...

  8. 移动端开发,文字增加,字体自动放大(font boosting)

    问题缘由:做文章详情页的时候,文字多了一点字体就放大了,真的是奇了怪了. 问题重现 一段文字的时候 两段文字的时候 很明显,字体放大了很多. 疑点 meta标签缩放的问题 最近正好遇到处理retain ...

  9. js监听页面放大缩小

    <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>d ...

随机推荐

  1. Windows系统环境下Solr之Java实战(一)搭建solr服务器并配置IK分词

    搭建solr服务器 1.下载地址:http://archive.apache.org/dist/lucene/solr/ 2.将D:\JavaWeb\Solr\solr-6.2.0\server\so ...

  2. 令assignment操作符返回一个reference to *this

    [令assignment操作符返回一个reference to *this] 关于赋值,可以把它们写成连锁形式: int x, y, z; x =y =z =15; II赋值连锁形式 上述连锁赋值被解 ...

  3. asp.net菜鸟到中级程序员的飞跃 --30本好书点评

    如果你是一个菜鸟或者自认为初学者那么本文非常适合你:不能说这30本书就是最佳组合,但是可以说这个组合不差:本人曾博览群书,很多书重复,很多书讲的不适用,这些书都是目前书店可以买到的:达到中级程序员以后 ...

  4. js 各类判断用户输入字符的格式函数

    1.JS 判断IP格式是否正确: function checkIP(ip) { var regular = /^(\d+)\.(\d+)\.(\d+)\.(\d+)$/;//正则表达式 if (reg ...

  5. spfa+差分约束系统(D - POJ - 1201 && E - POJ - 1364&&G - POJ - 1)+建边的注意事项+超级源点的建立

    题目链接:https://cn.vjudge.net/contest/276233#problem/D 具体大意: 给出n个闭合的整数区间[ai,bi]和n个整数c1,-,cn. 编写一个程序: 从标 ...

  6. 文件读取 FILE

    需要了解的概念 [数据流][缓冲区(Buffer)][文件类型][文件存取方式][借助文件指针读写文件] 需要理解的知识点包括:数据流.缓冲区.文件类型.文件存取方式 1.1 数据流: 指程序与数据的 ...

  7. console.dir() 与 console.dirxml() 的使用

    在调试JavaScript程序时,有时需要dump某些对象的详细信息.通过手工编写JavaScript代码可以完成这一工作:针对对象的属性进行循环,将循环到的每一个属性值打印出来:可见,这一过程是比较 ...

  8. java 判断上传文件大小

    /** * 判断文件大小 * * @param file * 文件 * @param size * 限制大小 * @param unit * 限制单位(B,K,M,G) * @return */ pu ...

  9. maven profile 优先级

    maven profile是有优先级别 也就是说在setting.xml的profile优先级比pom中同名的profile高. 可以使用 mvn help:active-profiles 这个命令是 ...

  10. MySQL 导入CSV数据

    第一步 创建表结构 create table t1( key1 ), v1 ) ); 第二步 导入数据 load data local infile 'D:/t1.csv' into table t1 ...