Programming

jQuery 이펙트(Effects) - 슬라이딩(sliding) - 스르륵 사라지고 나타나기

crazyits 2013. 7. 29. 22:50
반응형

축구에 보면 슬라이딩이라는 말이 있다.

미끄러지면서 상대방의 공을 뺏는 것을 말한다.

물론 여러곳에서 쓰이지만 jQuery 이펙트에도 이런 형태의 효과가 있다.


sliding 은 다음과 같은 것이 있다.

$().slideDown();		// 아래쪽으로 미끄러지는 효과
$().slideUp();			// 위쪽으로 미끄러지는 효과
$().slideToggle();	// 오르락 내리락 반복하는 효과 Down + UP


그럼 일단 대가리 아니 head에 들어가는 부분을 다음과 같이 작성한다.

jQuery를 포함하는 구문은 생략한다.




몸뚱아리(body) 부분에는 다음과 같이 작성을 한다.


이렇게 슝하고 나오는 겁니다.


아래로 툭 하고 튀어나오는 것을 볼수 있을 겁니다.

이제 슉 들어가는 slideup은 은 귀찮으니 몸둥아리(body)는 그냥 두고 머리(head)만 바꿉니다.



19금 어쩌구 저쩌구 되어 있는 부분을 클릭하면 자라목과 같이 수욱하고 들어갑니다.


마지막으로 slideToggle에 대해서는 다음과 같이 head를 작성합니다.




이제 몸뚱이(body)를 입력할 차례입니다. 다음처럼 입력


요새 섹시 컨셉 사진들에 눈이 가고 있습니다. 저도 수컷인가봐요?


입력이 되었다면 저장하고 웹 브라우저를 통해서 보세요.

상단의 '마우스~~' 부분을 클릭하면 나왔다가 들어갔다가 하는 것을 확인할 수 있습니다.

style 이나 div에 들어간 내용은 본인의 취향에 따라 바꾸어도 됩니다.

반응형