.fadeTo( duration, opacity [, complete ] )

.fadeTo( duration, opacity [, complete ] )

설명 : 일치하는 요소의 불투명도를 조정합니다.

이 .fadeTo()메서드는 일치하는 요소의 불투명도를 애니메이션으로 나타냅니다. 이것은 .fadeIn()메서드 와 비슷 하지만 메서드가 요소를 숨김 상태로 유지하고 항상 100 % 불투명도로 사라집니다.

기간은 밀리 초 단위로 표시됩니다. 값이 높을수록 느린 애니메이션이 아니라 빠른 애니메이션이 표시됩니다. 문자열 'fast'및 'slow'은 각각 지속 시간 200및 600밀리 초 를 나타 내기 위해 제공 될 수 있습니다 . 다른 문자열이 제공되면 기본 기간 인  400밀리 초가 사용됩니다. 다른 효과 메서드와 달리 명시 적으로 지정 .fadeTo()해야 duration합니다.

제공된 경우 애니메이션이 완료되면 콜백이 시작됩니다. 이는 서로 다른 애니메이션을 차례로 문자열로 연결하는 데 유용 할 수 있습니다. 콜백은 어떤 인수도 보내지 않지만 this애니메이션이 적용되는 DOM 요소로 설정됩니다. 여러 요소가 애니메이션으로 표시되는 경우 콜백은 애니메이션 전체에 대해 한 번이 아니라 일치 된 요소 당 한 번 실행된다는 점에 유의해야합니다.

간단한 이미지와 같은 요소를 애니메이트 할 수 있습니다.

<div id="clickme">

  Click here

</div>

<img id="book" src="book.png" alt="" width="100" height="123">

// With the element initially shown, we can dim it slowly:

$( "#clickme" ).click(function() {

  $( "#book" ).fadeTo( "slow" , 0.5, function() {

    // Animation complete.

  });

});