JQuery UI вкладки выбранного фона без изменения JavaScript - PullRequest
0 голосов
/ 16 декабря 2011

Я использую вкладки JQuery UI, как это:

http://kyleschaeffer.com/web-controls/simple-jquery-tabs-template/

У меня проблема в том, что у меня есть несколько наборов вкладок. У меня есть таблица с несколькими строками и чередующимся цветом фона белый / оранжевый. Я хочу, чтобы выбранная вкладка была того же цвета, что и фон, поэтому, если четная строка оранжевого цвета, я хочу, чтобы выбранная вкладка была оранжевой, но если она белая, я хочу, чтобы вкладка была белой.

CSS, который я использую:

.ui-tabs .ui-tabs-nav li.ui-tabs-selected a {
padding: 10px 20px 12px 20px;
background: #fff;
border-bottom-style: none;
  }

.ui-tabs .ui-tabs-nav li.ui-tabs-selected-orange a {
padding: 10px 20px 12px 20px;
background: #ff9900;
border-bottom-style: none;
}

В настоящее время каждая выбранная вкладка отображается оранжевым цветом. Как я могу использовать JQuery или JavaScript, чтобы знать, когда фон четный / нечетный, и соответственно изменить цвет выбранной вкладки?

1 Ответ

0 голосов
/ 17 декабря 2011

Потому что остальная часть вашего css неизвестна. Я спрашиваю, возможно, она сделает прозрачную выбранную вкладку:

.ui-tabs .ui-tabs-nav li.ui-tabs-selected a {
    padding: 10px 20px 12px 20px;
    background: transparent;
    border-bottom-style: none;
}

ИЛИ, я клянусь, вы знаете, является ли строка таблицы нечетной / четной и устанавливает классы css в строку, например, <tr class="odd">, тогда попробуйте:

.odd .ui-tabs .ui-tabs-nav li.ui-tabs-selected a {
background: #yourOddColor;
}

.even .ui-tabs .ui-tabs-nav li.ui-tabs-selected a {
background: #yourEvenColor;
}
...