선택된 요소에 대한 hover만을 처리할 때

어떤 여러 메뉴들이 있고, 이 메뉴들에 대한 hover 이벤트에 대해 jQuery 애니메이션을 설정하는 경우가 있을 수 있다.

보통 이러한 메뉴들은 class 이름이 같기 마련인데, 만약 이에 대해 아무 생각없이 

$('class').hover~~ 와 같이 처리하게 된다면, 한 메뉴만 hover이벤트가 발생해도 다른 모든 메뉴들까지 덩달아 애니메이션이 되는 것을 볼 수 있다.

이는 지극히 당연하게도 jQuery선택자가 모든 class 요소를 선택하였기 때문이다.

따라서 커서가 올라간 메뉴에 대해서만 이벤트를 발생시키려면, jquery 선택자 두번째 매개변수에 $(this)를 줌으로써 실행 컨텍스트 범위를 한정시킬 수 있다.

즉

$('class').hover(function() {

$this = $(this);

$('element', $this).animate ~~

와 같이 작성해 나아가면 된다.