DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> jQuery入門知識 >> JQuery特效代碼 >> jQuery之字體大小的設置方法
jQuery之字體大小的設置方法
編輯:JQuery特效代碼     

先獲取字體大小,進行處理。

再將修改的值保存。

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>

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved