1. 放大／縮小網頁字體大小

   
   

<script type="text/javascript">
    $(function(){
        $("span").click(function(){
            var thisEle = $("#para").css("font-size"); 
            var textFontSize = parseInt(thisEle , 10);
            var unit = thisEle.slice(-2); //獲取單位
            var cName = $(this).attr("class");
            if(cName == "bigger"){
                   if( textFontSize <= 22 ){
                        textFontSize += 2;
                    }
            }else if(cName == "smaller"){
                   if( textFontSize >= 12  ){
                        textFontSize -= 2;
                    }
            }
            $("#para").css("font-size",  textFontSize + unit);
        });
    });
  </script>
<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>

網頁換皮膚／背景

<script type="text/javascript">
        //<![CDATA[
        $(function(){
            var $li =$("#skin li");
            $li.click(function(){
                switchSkin( this.id );
            });
            var cookie_skin = $.cookie( "MyCssSkin");  //獲取cookie的值
            if (cookie_skin) {
                switchSkin( cookie_skin );
            }
        });
        function switchSkin(skinName){
                 $("#"+skinName).addClass("selected")                 //當前<li>元素選中
                              .siblings().removeClass("selected");  //去掉其它同輩<li>元素的選中
                $("#cssfile").attr("href","css/"+ skinName +".css"); //設置不同皮膚
                $.cookie( "MyCssSkin" ,  skinName , { path: '/', expires: 10 });
        }
        //]]>
</script>
<ul id="skin">
        <li id="skin_0" title="灰色" class="selected">灰色</li>
        <li id="skin_1" title="紫色">紫色</li>
        <li id="skin_2" title="紅色">紅色</li>
        <li id="skin_3" title="天藍色">天藍色</li>
        <li id="skin_4" title="橙色">橙色</li>
        <li id="skin_5" title="淡綠色">淡綠色</li>
    </ul>

    <div id="div_side_0">
        <div id="news">
            <h1 class="title">時事新聞</h1>
        </div>
    </div>
    <div id="div_side_1">
        <div id="game">
            <h1 class="title">娛樂新聞</h1>
        </div>
    </div>