jCarousel의 인스턴스 4 개, 마지막 하나만 작동합니다.

Question

나는 http://staticstore.cambiumlearning.com/에서 일하고 있습니다. <ul class="tabItem"> 인스턴스가있는 #tabInnerContainer 요소가 있고 각 인스턴스에서 jCarousel을 실행하려고하지만 마지막 인스턴스 만 작동하는 것 같습니다! 나는 ID로 개별적으로 초기화하려고 시도했으나 여전히 참조 된 마지막 것이 실행됩니다!

죄송합니다. 너무 애매한 경우 죄송합니다. 요청이있을 경우 더 많은 정보를 제공해 드리겠습니다. TIA, 아무도 도와 줄 수 없어!

Answer 1

각 회전식 당 하나의 화살표 쌍이 있지만 화살표가 서로 위에 있습니다 (마지막 회전식 톱은 z- 색인이 더 큽니다), 이것이 클릭시 변경되는 마지막 UL 일뿐입니다. "숨기기"클래스는 UL 자체가 아닌 UL과 화살표 모두의 컨테이너에 놓아야합니다.

function selectTab(thing) { 
    $('#tabContainer .tabs a').each(function(index) { 
     $(this).removeClass('tabSelected'); 
    }); 
    $(thing).addClass('tabSelected'); 
    $('#tabInnerContainer ul.tabItem').each(function(index) { 
     if ($(this).attr('data-category') === $(thing).attr('data-category')) { 
      $(this).parent('.jcarousel-skin-tango').removeClass('hide'); 
      //alert($(this).attr('id') + ' should be visible!'); 
     } else if ($(this).attr('data-category') != $(thing).attr('data-category')) { 
      $(this).parent('.jcarousel-skin-tango').addClass('hide'); 
     } 
    }); 
}