jQuery之字體大小的設(shè)置方法
先獲取字體大小,進(jìn)行處理。
再將修改的值保存。
slice() 方法可從已有的數(shù)組中返回選定的元素。
arrayObject.slice(start,end)。
start 必需。規(guī)定從何處開始選取。如果是負(fù)數(shù),那么它規(guī)定從數(shù)組尾部開始算起的位置。也就是說,-1 指最后一個(gè)元素,-2 指倒數(shù)第二個(gè)元素,以此類推。
end 可選。規(guī)定從何處結(jié)束選取。該參數(shù)是數(shù)組片斷結(jié)束處的數(shù)組下標(biāo)。如果沒有指定該參數(shù),那么切分的數(shù)組包含從 start 到數(shù)組結(jié)束的所有元素。如果這個(gè)參數(shù)是負(fù)數(shù),那么它規(guī)定的是從數(shù)組尾部開始算起的元素。
jQuery代碼如下:
<script type="text/javascript">
$(function(){
$("span").click(function(){
//獲取para的字體大小
var thisEle = $("#para").css("font-size");
//parseFloat的第二個(gè)參數(shù)表示轉(zhuǎn)化的進(jìn)制,10就表示轉(zhuǎn)為10進(jìn)制
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;
}
//設(shè)置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>
相關(guān)文章
js 實(shí)現(xiàn)一些跨瀏覽器的事件方法詳解及實(shí)例
這篇文章主要介紹了js 實(shí)現(xiàn)一些跨瀏覽器的事件方法詳解及實(shí)例的相關(guān)資料,需要的朋友可以參考下2016-10-10
淺析Js(Jquery)中,字符串與JSON格式互相轉(zhuǎn)換的示例(直接運(yùn)行實(shí)例)
這幾天,遇到了json格式在JS和Jquey的環(huán)境中,需要相互轉(zhuǎn)換,在網(wǎng)上查了一下,大多為缺胳膊少腿,也許咱是菜鳥吧,終于測(cè)試成功后,還是給初學(xué)者們一個(gè)實(shí)例吧2013-07-07
jQuery綁定事件不執(zhí)行但alert后可以正常執(zhí)行
這篇文章主要為大家解決下為什么jQuery綁定事件不執(zhí)行而alert后可以正常執(zhí)行,需要的朋友可以參考下2014-06-06
jquery判斷復(fù)選框是否選中進(jìn)行答題提示特效
這篇文章主要介紹了jquery判斷復(fù)選框是否選中進(jìn)行答題提示特效,感興趣的小伙伴們可以參考一下2015-12-12
jquery+php實(shí)現(xiàn)搜索框自動(dòng)提示
百度上有個(gè)很使用的功能,就是用戶在搜索的時(shí)候會(huì)自動(dòng)提示相關(guān)搜索條件以供選擇,非常人性化的設(shè)計(jì),我們?nèi)绾螌⒋斯δ芊诺阶约旱捻?xiàng)目中呢,經(jīng)過一番研究,終于實(shí)現(xiàn)了此功能,分享給大家。2014-11-11
jquery ztree實(shí)現(xiàn)模糊搜索功能
這篇文章主要為大家詳細(xì)介紹了jquery ztree實(shí)現(xiàn)模糊搜索功能,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-02-02
JQuery入門——事件切換之toggle()方法應(yīng)用介紹
在toggle()方法中,可以依次調(diào)用N個(gè)指定的函數(shù),直到最后一個(gè)函數(shù),然后重復(fù)對(duì)這個(gè)函數(shù)輪番調(diào)用,在函數(shù)之間切換調(diào)用的時(shí)候相當(dāng)?shù)姆奖?接下來將會(huì)詳細(xì)介紹toggle()方法的使用,感興趣的你可不要錯(cuò)過了啊2013-02-02
基于Jquery實(shí)現(xiàn)表單驗(yàn)證
本文給大家分享的是一段基于Jquery實(shí)現(xiàn)表單驗(yàn)證的代碼,非常簡(jiǎn)單實(shí)用,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2015-08-08

