jQuery 이펙트(Effects) - 페이드(Fading) 숨김, 나타내기, 투명도등등...

fade 효과를 적용하기 위해서는 다음과 같은 함수들을 사용합니다.

$().fadeIn();				// 지정한 요소를 나타나게 합니다.
$().fadeOut();				// 지정한 요소를 사라지게 합니다.
$().fadeToggle();			// in + out 효과를 반복합니다.
$().fadeTo();	// 불투명하게 사라집니다.

어떤 동작을 하는지 알아보기 위해서 일단 head에 다음과 같이 작성합니다.

html의 body에 다음과 같이 입력합니다.

시골 부동산 가격 비싸다

fadeout을 알아보기 위해서 head에는 다음을 입력합니다.

내용이 보여야 되는 body 부분에는

보험료도 대박

페이지를 확인하면 처음에 보이던 것이 버튼을 누르면 사라집니다.

fadeToggle는 fadeIn과 Out을 번갈아 가면서 수행합니다.

head에 다음과 같이 입력합니다.

화면에 뭔가 보여야겠죠? 그러니 body 부분에 다음의 내용을 넣어줍니다.

저 좀 데려가세요.

버튼을 누를때마다 나타났다가 사라졌다를 반복할 겁니다.

fadeTo는 바로 위에 만들었던 fadeToggle에서 head만 조금 변경합니다.

body 부분은 재활용 합니다. 버튼을 누르면 진했던 색상이 옅어지는 것을 확인할 수 있습니다.