2009-11-19 4 views
3

간단한 문제 : UI 테마없이 Accordion을 사용하고 있습니다 (베어 본, 자체 CSS 사용).jQuery UI - 아코디언 - 스타일이 적용되는 헤더?

지금까지는 내가 선택한 머리글에 대해 "활성"스타일을 설정하는 방법을 알 수 없다는 점만 제외하면 좋습니다.

JQuery와 코드 :

$("#menu").accordion({ 
    event: "mouseover", 
    header: "a.top" 
}); 

HTML 코드 :

<a href="#" class="top">XXX1</a> 
<div class="sub"> 
    <a href="#">Subheading 1</a> 
    <a href="#">Subheading 2</a> 
    <a href="#">Subheading 3</a> 
</div> 

<a href="#" class="top">XXX2</a> 
<div class="sub"> 
    <a href="#">Subheading 1</a> 
    <a href="#">Subheading 2</a> 
    <a href="#">Subheading 3</a> 
</div> 

이 내가 ThemeRoller를 사용하지 않고 활성 헤더의 스타일을 정의 할 수있는 방법을 찾을 수없는 것을 제외하고 잘 작동합니다. ,

.ui-state-active 
.ui-widget-content .ui-state-active 
.ui-state-active a 
.ui-state-active a:link 
.ui-state-active a:visited 

지원하십시오

수동으로 내 CSS에 다음과 같은 스타일 설정이 적용되지 않습니다?

+0

CSS 스타일이 jQuery에 의해 재설정되지 않는 것을 확인할 수 있습니까? 저는 .ui-state-active로 이것을 시도했고 스타일을 바꿀 수있었습니다 –

+0

해결책을 찾았습니까? – Laguna

답변

0
$("#menu").accordion({ 
    header: "a", 
    event: mouseover, 
    active:0 
}); 

"활성"컨트롤을 사용하십시오. themeroller없이 작동하는지 확실하지 않습니다. 위젯에는 메뉴를 만드는 데 사용되는 모든 "헤더"의 실행 횟수가 있습니다. 색인 0은 첫 번째 xxx1이고 색인 1은 두 번째 xxx2 등입니다 ...

1

나는 이것도 애써 썼습니다. 내 a.nav 링크와 지정된 헤더 인 '.nav'를 둘러싼 h3 태그를 제거했습니다. 내 CSS에는 오픈 아코디언 div의 헤더를 변경하는 "a.ui-state-active"가 포함되었습니다. 내게는 "a"를 앞세워 차이를 만들었습니다. 사람들을위한

0

은 여전히 ​​당신의 CSS이 추가 jQuery를-UI를 사용하여 :

.ui-accordion-header-active { 
    background: red !important; 
} 

그냥 당신이 원하는 색상이나 배경을 변경!

관련 문제