文档章节

Jquery操作UI之设置字体大小

前端老手
 前端老手
发布于 09/22 16:21
字数 475
阅读 9
收藏 0

先获取字体大小,进行处理。再将修改的值保存。

slice() 方法可从已有的数组中返回选定的元素。
arrayObject.slice(start,end)。
start     必需。规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推。


end     可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。
jQuery代码如下:

<script type="text/javascript">
    $(function(){
        $("span").click(function(){
            //获取para的字体大小
            var thisEle = $("#para").css("font-size"); 
            //parseFloat的第二个参数表示转化的进制,10就表示转为10进制
            var textFontSize = parseFloat(thisEle , 10);
            //javascript自带方法
            var unit = thisEle.slice(-2); //获取单位
            var cName = $(this).attr("class");
            if(cName == "bigger"){
                    textFontSize += 2;
            }else if(cName == "smaller"){
                    textFontSize -= 2;
            }
            //设置para的字体大小
            $("#para").css("font-size",  textFontSize + unit );
        });
    });
  </script>

html代码如下:

<body>

<div class="msg">
    <div class="msg_caption">
        <span class="bigger" >放大</span>
        <span class="smaller" >缩小</span>
    </div>
    <div>
        <p id="para" >
        This is some text. This is some text. This is some text. This is some text. This
        is some text. This is some text. This is some text. This is some text. This is some
        text. This is some text. This is some text. This is some text. This is some text.
        This is some text. This is some text. This is some text. This is some text. This
        is some text. This is some text.
        </p>
    </div>
</div>

</body>

本文转载自:https://www.mk2048.com/blog/blog.php?id=20k1h0j0j

前端老手
粉丝 10
博文 589
码字总数 0
作品 0
卢湾
技术主管
私信 提问
25+ 个 jQuery 网页拖放操作的插件

这篇文章为你介绍27个jQuery插件,使得你的Web前端具备拖放操作的能力。 Ajax Upload 提供文件拖放上传,并显示上传进度 Drop n’ Save – Drag & Drop Uploader 另外一个文件拖放上传功能的...

红薯
2012/04/09
17.2K
10
分享 13 个帮助你简化开发的 jQuery 插件

jQuery的社区力量的重要体现就是jQuery插件,我们每隔一段时间就会在jQuery插件大全中给大家推荐最新最好用的jQuery插件,今天我们带来了12个帮助你有效简化开发的jQuery插件,希望大家喜欢!...

gbin1
2012/07/23
4.7K
8
jquery、CSS、icon、字体、模板、CDN资源库汇总(庞大的前端干货)

jQuery(js)库: jQueryfuns:43,849 个HTML, CSS & 响应式模板 http://www.jqueryfuns.com/ datouwang 一个js特效库 http://www.datouwang.com/ js代码网 大量js和css效果代码分享 http:/......

找前辈网
2017/10/24
0
0
26 个 jQuery使用技巧

The use of the jQuery library is growing and growing(just released jQuery 1.4), more and more people are using this useful javascript library. This means that more and more usef......

长平狐
2013/01/06
75
0
jQuery UI 1.8.5 发布-下载

这是 jQuery UI 1.8 的第五个维护版本,包含核心模块的bug修复,以及包括 Autocomplete, Button, Datepicker Dialog, Tabs widgets 的定位问题修复. 更详细的改进内容请看 changelog. 下载地...

红薯
2010/09/18
3K
1

没有更多内容

加载失败,请刷新页面

加载更多

如何使用soapUI模拟webservice客户端发送请求

参考资料 https://jingyan.baidu.com/article/cbcede0712849a02f40b4d88.html 左边是请求参数,可以自己填写!按着那个绿色三角箭头可以模拟发送请求,右边是返回的报文 soapui如何发送xml格...

故久呵呵
21分钟前
3
0
Java Security 介绍

1.介绍 Java平台设计的重点是安全性。在其核心,java语言本身是类型安全的并且提供了垃圾自动回收,这使其增加了应用程序代码的健壮性。安全的类加载以及验证机制确保了只有合法的代码才能够...

lixiaobao
27分钟前
3
0
Niushop开源商城系统-分销商管理

分销商管理 1.分销员的招募与管理 如何申请成为分销员? 在wap端个人中心满足之前设置的升级条件,可以申请分销员 开启分销商审核,需要在后台分销商管理——》待审核处进行审核通过。 通过完...

niushop-芳
27分钟前
2
0
为什么大公司一定要使用 DevOps?

究竟什么是DevOps? 要想回答这个问题,首先要明确DevOps这个过程参与的人员是谁,即开发团队和IT运维团队。那么,DevOps的意图是什么呢?即在两个团队之间,建立良好的沟通和协作,更快更可靠...

cs平台
30分钟前
4
0
高危预警|RDP漏洞或引发大规模蠕虫爆发,用户可用阿里云免费检测服务自检,建议尽快修复

2019年9月6日,阿里云应急响应中心监测到Metasploit-framework官方在GitHub空间公开了针对Windows远程桌面服务远程命令执行漏洞(CVE-2019-0708)的利用代码。利用该代码,无需用户交互操作,即...

Mr_zebra
35分钟前
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部