버튼시 텍스트가 점진적으로 커지거나 작아지게 하기

==== switcher.html ==== <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<A href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</A>"> <html> <head> <title> 이벤트 발생 예제 </title> <meta http-equiv="Content-Type" content="text/html;charset=EUC-KR"/> <script type="text/xxxxjavascript" src="jquery.js"></script> <script type="text/xxxxjavascript" src="switcher.js"></script> <link rel="stylesheet" type="text/css" href="switcher.css"/> </head> <body> <h3>'나는 문제없어'의 가사</h3> <div id="switcher">    <div class="label">Text Size</div>  <button id="switcher-dafault">Default</button>  <button id="switcher-large">Bigger</button>  <button id="switcher-small">Smaller</button>   </div> <div class="speech"> 이 세상 위에 내가 있고, 나를 사랑해주는 나의 사람들과 나의길을 가고싶어. 많이 힘들고 외로웠지 그건 연습일뿐야. 넘어지진 않을거야 나는 문제없어. </div> </body> </html>       ==== 하나의 버튼을 눌렀을때 폰트 사이즈 크게 하기 ==== $(document).ready(function(){  /* 반복해서 사용하는 jQuery객체는 변수에 담아서 사용한다. $는 자바스크립트에서 변수명에 사용  할 수 있다. jQuery 객체를 저장하고 있다는 의미로 사용을 하는것이다. */  var $speech = $("div.speech");    $("#switcher-large").click(function(){    /* parseFloat() 함수는 왼쪽에서 오른쪽으로 순회하면서, 숫자외의 문자가 나올 때까지의   문자열을 실수형(십진수) 숫자로 변환하는데, 숫자형이 아닌 문자들이 뒤에 붙어있다면 이런   문자들은 버려진다. '12px'의 경우, 'px'가 버려지고 12로 변환된다.parseFloat의 두번째   인자는 10진수로 변환되도록 지정한다는 의미이다.*/   var num = parseFloat($speech.css("fontSize"),10); // .css()메서드로 폰트사이즈를 얻는다.   num *= 1.4;  // 폰트사이즈를 40%만큼 커지게 하기위해 1.4를 곱한다.   $speech.css("fontSize", num + "px"); /* 클릭할때마다 폰트 사이즈를 현재 폰트사이즈에서            40%씩 증가시킨다.*/  }); });         ==== 글자크기를 크게하거나 작게하기 ==== $(document).ready(function(){  var $speech = $("div.speech"); var defaultSize = $speech.css("fontSize");  $("#switcher button").click(function(){       // 클릭이벤트의 범위를 버튼으로 묶는다.   var num = parseFloat($speech.css("fontSize"),10);   if(this.id == "switcher-large")  // 클릭된 버튼 id가 'switcher-large' 라면,   {    num *= 1.4;   // 글자크기를 크게하기위해 num변수에 1.4를 곱한다.   }   else if(this.id == "switcher-small")       // 클릭된 버튼 id가 'switcher-small' 이라면,   {    num /=1.4;  // 글자크기를 작게하기 위해 num변수를 1.4로 나눈다.   }   else if(this.id == "switcher-default")        // 디폴트 사이즈로 돌아가는 구문.   {    num = parseFloat(defaultSize, 10);   }   $speech.css("fontSize", num + "px");  }); });