jQuery 함수에서 .effect를 사용할 수 없습니다.

Question

안녕하세요. 저는 현재 jQuery를 사용하여 페이지에서 제품을 정렬하고 필터링해야하는 프로젝트를 수행하고 있습니다. 그러나 사용자 선택을 기반으로 결과를 완벽하게 표시하고 숨기는 스크립트를 만들었지 만 전환 사이의 애니메이션을 다르게 실행하고 싶습니다. 나는 이미 fadeOut과 fadeIn을 사용하여 그것들을 설정했다. 그러나 jQuery의 .effects 기능을 사용하고 싶었습니다. 나는 어디서 잘못 될지 또는 내가 그것을 사용할 수 있는지 잘 모르겠다. 아래 내 코드를 참조하십시오. 페이드를 사용하여 전체 스크립트를 작성합니다.

$(document).ready(function() { 
$('ul#filter a').click(function() { 
    $(this).css('outline','none'); 
    $('ul#filter .current').removeClass('current'); 
    $(this).parent().addClass('current'); 

    var filterVal = $(this).text().toLowerCase().replace(' ','-'); 

    if(filterVal == 'all') { 
     $('ul#selection li.hidden').fadeIn('slow').removeClass('hidden'); 
    } else { 

     $('ul#selection li').each(function() { 
      if(!$(this).hasClass(filterVal)) { 
       $(this).fadeOut('slow').addClass('hidden'); 
      } else { 
       $(this).fadeIn('slow').removeClass('hidden'); 
      } 
     }); 
    } 

    return false; 
}); 

});

다음은 접이식 효과를 사용하려는 시도입니다.

$('ul#selection li').each(function() { 
     if(!$(this).hasClass(filterVal)) { 
      $(this).effect('fold','slow').addClass('hidden'); 
     } else { 
      $(this).fadeIn('slow').removeClass('hidden'); 
     } 
    }); 
} 

누군가 내가 잘못 가고있는 부분을 지적 할 수 있습니까?

Answer 1

1. 당신이 jQuery를 UI는
2. 이 시도 포함되어 있는지 확인하십시오 : $(this).effect('fold','slow', function(e) { $(this).addClass('hidden'); })

그냥 직접 .effect() 후, 오히려 효과가 완료되면보다, 즉시 일어날 .addClass()을 체인합니다. 따라서 .hidden 클래스가 실제로 CSS로 항목을 숨기면 접기 효과에주의하기 전에 즉시 사라지는 것처럼 보일 것입니다. 따라서 .addClass()은 .effect()의 콜백이어야합니다.