2014-12-28 4 views
0

여기 피들을 설치했습니다 : http://jsfiddle.net/bnnsqwsd/.활성 탭 클릭 문제

기본적으로 http://jsfiddle.net/syahrasi/Us8uc/을 다시 만들려고하는데 몇 가지 변경 사항이 있습니다 (주로 ID에서 데이터 속성으로 변경되므로 한 페이지에 여러 탭 모듈을 포함 할 수 있음).

로드 후 첫 번째 활성 탭 (탭 # 1)을 클릭하면 작동하지 않습니까?

여기 내 jQuery의 :

$(document).ready(function() { 
    $(".tabs-menu a").click(function(event) { 
    event.preventDefault(); 
    $(this).parent().addClass("current"); 
    $(this).parent().siblings().removeClass("current"); 
    var tab = $(this).data("tab"); 
    $(".tab-content").not(tab).css("display", "none"); 
    $(tab).fadeIn(); 
    }); 
}); 

답변

3

<li class="current"><a href="#tab-1" data-tab=".tab-1">Tab 1</a></li> 

DEMO

1

당신은 처음 타를 변경해야 할 첫 번째 리튬에

data-tab=".tab-1" 

을 추가하는 것을 잊지 기지국은 내가 또한이 탭을 사용하여 http://jsfiddle.net/bnnsqwsd/2/

0

에서

<a href="#" data-tab=".tab-1">Tab 1</a> 

데모에 연결합니다. 좋은 스크립트. 나는 어떻게 하나씩 자동 변화를 만들 수 있는지 알고 싶다. 5 초마다 다음 탭이 활성화됩니다. 슬라이더와 같은 것