사용자 정의 jquery 탭을 만드는 방법은 무엇입니까?

Question

이 특정 시나리오가 있습니다 :

나는 4 개의 탭이 있고 각 탭에는 그것이 선택되었을 때를위한 2 개의 아이콘이 있습니다.

내가 원하는 것은 탭을 클릭 할 때 아이콘이 변경되고 다른 탭을 클릭하면 다른 아이콘으로 변경됩니다.

p.s. 나는 컨테이너 자체의 내용이 아니라 탭 자체에 대해 이야기하고 있습니다.

감사

확인이 이미지 : http://answers.oreilly.com/index.php?app=core&module=attach&section=attach&attach_rel_module=post&attach_id=621

Answer 1

각 탭마다 고유 한 CSS 클래스가 있다고 가정하면 탭의 각 그림에 대해 CSS에 background-image을 사용할 수 있습니다. 그런 다음

탭은 다음 다른 이미지를 예를 들어

제공 (당신이 다음 "을 선택"또는 무언가 같이 선택되어 말을 클래스에 추가 할 수있는)를 선택한 경우 :

 
.book_tab{ 
background-image:url('img_plane.png'); 
background-repeat:no-repeat;` 
} 
.rent_tab{ 
background-image:url('img_car.png'); 
background-repeat:no-repeat;` 
} 
.deals_tab{ 
background-image:url('img_tag.png'); 
background-repeat:no-repeat;` 
} 
.book_tab .selected{ 
background-image:url('img_plane2.png'); 
background-repeat:no-repeat;` 
} 
.rent_tab .selected{ 
background-image:url('img_car2.png'); 
background-repeat:no-repeat;` 
} 
.deals_tab .selected{ 
background-image:url('img_tag2.png'); 
background-repeat:no-repeat;` 
}

Answer 2

당신이 선택한 클래스가 활성 탭에 적용되는 UI 탭을 사용하는 경우. 네가 아니었다면 너 스스로 그것을 적용 할 수 있다고 확신한다. 당신이해야 할 일은 css에서 이미지를 배경으로 제공하는 것뿐입니다.