HTML/Javascript 기초 (53) 썸네일형 리스트형 [Javascript] 지정한 위치로 물고기 이동시키기(애니메이션 사용하기) 지정한 위치로 물고기 이동시키는 것을 부드럽게 표현해보자. animate 선언하기 전에 stop()을 추가하면 애니메이션 실행 중에 그 다음 애니메이션을 바로 실행할 수 있다. 여기에 클릭한 위치 값 출력 [Javascript] 배너 이동하기(애니메이션 사용) 저번에 했던 배너이동을 애니메이션을 이용하여 부드럽게 표시해보자 좌표 설정하는 부분을 애니메이션부븐으로 바꿔주기만하면 된다. 이전 다음 [Javascript] 애니메이션 사용하기(사용자 제어) 애니메이션을 실행하면서 중간에 중지하는 사용자제어를 할 수 있다. start stop [Javascript] 애니메이션 사용하기(animate option) 애니메이션을 실행할 때 여러가지 옵션을 갖고 표시할 수 있다. progress라는 곳에서 여러가지 옵션을 확인할 수 있다. hide image [Javascript] 애니메이션 사용하기(slideDown, slideUp) slideDown(duration, ease function) : 이미지를 위에부터 아래로 나타낸다. slideUp(duration, ease function) : 이미지를 아래서부터 위로 숨긴다. slide donw slide up [Javascript] 애니메이션 사용하기(fadeIn, fadeOut) 애니메이션을 이용하여 fadein fadeout 효과를 줄 수 있다. fadeIn(duration, ease function) 서서히 나타남 fadeOut(duration, ease function) 서서히 사라짐 show hide [Javascript] 애니메이션 사용하기(ease 함수 이용하기) 기본적으로 내장되어있는 애니메이션이 있지만 그것을 시간 차를 두거나 살짝 다르게 애니메이션을 진행할 수 있다, 그것이 바로 ease를 이용하는 것이다. http://gsgd.co.uk/sandbox/jquery/easing/ jQuery Easing Plugin Please note, the easing function names changed in version 1.2. Please also note, you shouldn't really be hotlinking the script from this site, if you're after a CDN version you could do worse than try cdnjs.com Example Click on any of the yellow heade.. [Javascirpt] 애니메이션 사용하기(show, hide) 자바스크립트에서 애니메이션인 show와 hide를 이용하여 이미지를 나타내고 없애는 것을 해보자. show hide 이전 1 2 3 4 ··· 7 다음
