Resize Font / Text jQuery di Blogger

Penerapkan "jQuery Tip: Font Resizing With Animation Effects
" di " blogger template ". Hasilnya effect perubahan ukuran text/font tersebut cukup
memuaskan, sangat halus. Jika anda tertarik untuk menerapkan di blogger template, terlebih dahulu lihat demo Resize Font/Text jQuery di header blog ini.

Cara menmbuat atau menerapkannya pada blogger blogspot.

  1. Masukan script jQuery berikut diatas </head> :
   <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
  2. Masukan kode Javascript berikut dibawah script jQuery tadi:



<!-- begin ResizeFont -->

<script type='text/javascript'>

$(function(){

$(&#39;input&#39;).click(function(){

var ourText = $(&#39;#content-wrapper&#39;);

var currFontSize = ourText.css(&#39;fontSize&#39;);

var finalNum = parseFloat(currFontSize, 10);

var stringEnding = currFontSize.slice(-2);

if(this.id == &#39;large&#39;) {

finalNum *= 1.1;

}

else if (this.id == &#39;small&#39;){

finalNum /=1.1;

}

else if (this.id == &#39;reset&#39;){

finalNum =13;

}

ourText.animate({fontSize: finalNum + stringEnding},500);

});

});

</script>

-> Catatan <-
- "#content-wrapper" diatas dapat ganti, sesuai bagian yang akan anda berikan effect resize font.
- "finalNum *= 1.1;", "finalNum /=1.1;", "finalNum =13;", "stringEnding},500", angka-angka tersebut dapat anda rubah, sesuai selera anda.

3. Masukan kode HTML berikut, masalah penempatan sesuaikan dengan karakter template anda.

<div id='resizeFont'>
<input id='large' type='button' value='A+'/>
<input id='reset' type='button' value='A'/>
<input id='small' type='button' value='A-'/>
</div>

kalau masih bingung menempatkannya silahkan tanyakan/berkomentar di artikel ini insaAllah akan di bantu.