본문 바로가기
javaScript/jQuery

클릭하면 이미지가 사라지고 나타나는 애니메이션 효과 show, hide

by mooyou 2023. 5. 17.
728x90
300x250
SMALL

show, hide

$대상.show()
$대상.show([duration] [,complete])
$대상.show([duration] [,easing] [,complete])
$대상.show([option])
$대상.hide()
$대상.hide([duration] [,complete])
$대상.hide([duration] [,easing] [,complete])
$대상.hide([option])

 

  • duration :  효과가 지속될 시간 값
  • easing : 이징함수명 (애니메이션의 움직임의 변화를 구현하는 함수)
  • complete : 효과가 완료됐을 때 호출할 콜백 함수
  • option :  duration, easing, complete매개변수를 하나의 객체로 묶어서 간결하게 매개변수를 전달 할수 있고 기본적인매개변수 값 외에 좀 더 다양한 값을 설정할때 사용할 수 있다.

 

 

show버튼을 클릭하면 이미지가 나타나고 완료 후 alert 창 출력

hide 버튼을 클릭하면 이미지가 사라지고 완료 후 alert 창 출력

 

728x90
반응형
LIST

댓글