jQuery

jQuery의 animate 기능은 이전에 살펴봤던 hide/show, fade, slide와 같이이미 정해진 움직임을 element에 부여하는 함수와는 다르게 우리가 원하는대로 customize한 움직임을 element에 부여할 수 있다. $(selector).animate({params}[,duration][,callback]); animate의 기본적인 syntax는 위와 같다. 우선 필수적인 인자로 params라는 객체가 들어온다.이 params는 animate될 수 있는 CSS 속성 객체가 들어오는데, CSS 속성은 반드시 single numeric value여야 한다.예를들어 width, height, left와 같은 값은 animate될 수 있으나, background-color와 같은 no..

세 번째로 알아볼 jQuery Effect는 Slide이다.element가 사라지거나 나타날 때 slide 효과를 준다. $(selector).slideDown([duration][,callback]);$(selector).slideUp([duration][,callback]);$(selector).slideToggle([duration][,callback]); slideDown은 element가 나타날 때, slideUp은 element를 사라지게 할때, slideToggle은 slideDown, slideUp 함수를 토글하는 함수이다.이전에 포스팅했던 effect들과 마찬가지로 함수의 인자로 duration과 callback 함수가 있다. duration은 "slow", "fast", 혹은 숫자가 들..

두 번째로 알아볼 jQuery Effect는 Fade이다.이전에 포스팅했던 hide/show effect는 함수호출 시 element를 한번에 없어지게 하거나 나타나게 했다면,Fade는 투명도를 서서히 조절하며 element를 화면에 나타내거나 없앤다. Fade Effect 관련 함수는 다음과 같다. $(selector).fadeIn([duration][,callback]);$(selector).fadeOut([duration][,callback]);$(selector).fadeTo(duration,opactiy[,callback]);$(selector).fadeToggle(duration[,callback]); fadeIn, fadeOut은 element의 이름 그대로의 효과를 적용하고, fadeTo는..

Javasciript의 복잡한 코드를 단순하게 만들어주는 jQuery의 Effects에 대해서 알아보자.jQuery Effect는 HTML element들의 animation을 제어할 수 있으므로, 이 기능을 사용하면 우리가 좀더 동적인 웹페이지를 구성할 수 있을것이다. 앞으로 살펴볼 jQuery Effect들 중에서 가장 처음으로 다룰 주제는 Hide/Show 기능이다.이 기능은 단순히 element를 웹페이지에서 숨기거나 다시 보여지게 하는 기능이다.hide/show effect를 구현하는 함수 syntax는 다음과 같다. $(selector).hide([duration][,callback]);$(selector).show([duration][,callback]);$(selector).toggle([..