2013-02-03 3 views
1
내가 동위 원소 항목을 필터링하려면 다음 jQuery를 사용하고

에 클래스를 추가현재 동위 원소 필터

<nav id="nav"> 
     <ul> 
      <li><a href="" data-filter="*">All</a></li> 
      <li><a href="" data-filter=".cat1">Category 1</a></li> 
      <li><a href="" data-filter=".cat2">Category 2</a></li> 
      <li><a href="" data-filter=".cat3">Category 3</a></li> 
      <li><a href="" data-filter=".cat4">Category 4</a></li> 
      <li><a href="" data-filter=".cat5">Category 5</a></li> 
     </ul> 
    </nav> 

내가 현재 필터 링크 싶습니다이 HTML에 해당

$('#nav a').click(function(){ 
     var selector = $(this).attr('data-filter'); 
     $container.isotope({ 
     filter: selector, 
     animationOptions: { 
     duration: 1200, 
     easing: 'linear', 
     queue: false, 

     } 
     }); 

보기에있을 때 "현재"의 수업을 갖기. 이 작업을 수행하는 방법에 대한 아이디어가 있습니까?

답변

2

addClass 및 removeClass를 함수에 사용할 수 있습니다. 이전에 선택한 항목에서 클래스를 지우려면 클래스를 추가하기 전에 모든 항목에서 클래스를 제거해야합니다.

$('#nav a').click(function(){ 
     //removes class from all items to "clear" the class from your menu 
     $('#nav a').removeClass("current"); 

     //adds the class to whichever item you clicked 
     $(this).addClass("current"); 

     var selector = $(this).attr('data-filter'); 
     $container.isotope({ 
     filter: selector, 
     animationOptions: { 
     duration: 1200, 
     easing: 'linear', 
     queue: false, 

     } 
     }); 
});