Don't like ads? PRO users don't see any ads ;-)
Guest

Untitled

By: a guest on Apr 24th, 2012  |  syntax: None  |  size: 1.25 KB  |  hits: 24  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. jQuery Isotope - Filtering with AND (exclusion)
  2. <ul class="project-tags">
  3.     <li><a class="all selected" data-filter="all">All</a></li>
  4.     <li><a class="" title="Filter1" data-filter=".Filter1">Filter1</a></li>
  5.     <li><a class="" title="Filter2" data-filter=".Filter2">Filter2</a></li>
  6.     <li><a class="" title="Filter3" data-filter=".Filter3">Filter3</a></li>
  7.     <li><a class="" title="Filter4" data-filter=".Filter4">Filter4</a></li>
  8. </ul>
  9.  
  10.  
  11. var $iso = $('#projects');
  12.        
  13. $.filterIsotope = function(filter)
  14. {
  15.     $iso.isotope({ filter:filter });
  16. }
  17.  
  18. $('.sidebar a').click(function(event){
  19.     //$("body,html").animate({scrollTop:125});
  20.    // event.preventDefault();
  21.     var cat = $(this).attr('data-filter'),
  22.         $links = $('#work-grid2 .sidebar a:not(.all)'),
  23.         filter = "";
  24.     if (cat == 'all')
  25.     {
  26.         $links.removeClass('selected');
  27.     }
  28.     else
  29.     {
  30.         $('.sidebar a.all').removeClass('selected');
  31.     }
  32.     $(this).toggleClass('selected');
  33.     $links.each(function(index){
  34.         if ($(this).hasClass('selected'))
  35.         {
  36.             if (filter.length) filter += ", ";
  37.             filter += $(this).attr('data-filter');
  38.         }
  39.     });
  40.     if (filter == "") $('.sidebar a.all').addClass('selected');
  41.     $.filterIsotope(filter);
  42. })