[jQuery] 효과, 페이딩 (fadeOut, fadeIn, fadeTo)

• fadeOut([speed], [callback]) / version : 1.0
   - 지정한 시간동안 투명도를 1에서 0으로 감소시키고 style의 display:none 상태로 적용시킨다.
     해당 요소가 서서히 사라지게 표현된다.
  
  $(document).ready(function(){
      $("#test_id").click(function(){
          $("#a").fadeOut(500);
      });
  });
  
   - test_id 라는 id를 가진 요소를 클릭하면 a라는 id를 가진 요소가 0.5초간 페이딩(Out) 효과를 나타내며 사라진다.
  
  
• fadeIn([speed], [callback]) / version : 1.0
   - 지정한 시간동안 투명도를 0에서 1로 증가시키고 style의 display를 none의 이전상태(block 또는 liline)로 적용시킨다.
    해당 요소가 서서히 나타나게 표현된다.
  
  $(document).ready(function(){
      $("#test_id").click(function(){
          $("#a").fadeIn(500);
      });
  });
  
   - test_id 라는 id를 가진 요소를 클릭하면 a라는 id를 가진 요소가 0.5초간 페이딩(In) 효과를 나타낸다.
  
  
• fadeTo(speed, opacity, [callback]) / version : 1.0
   - 지정한 시간동안 투명도를 opacity만큼 증가 또는 감소시킨다.
  
  $(document).ready(function(){
      $("#test_id").click(function(){
          $("#a").fadeTo(500, 0.33);
      });
  });
  
   - test_id 라는 id를 가진 요소를 클릭하면 a라는 id를 가진 요소가 0.5초간 투명도를 0.33으로 변경되면서 페이딩(To) 효과를 나타낸다.

[출처] http://m.blog.naver.com/darkelfand/90077804593