JQuery Аккордеонный стиль меняется при открытии - PullRequest
Новая
       5

JQuery Аккордеонный стиль меняется при открытии

1 голос
/ 21 марта 2012

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

Я хочуКоробка, в которой находится аккордеон, должна быть закруглена сверху и снизу, несмотря ни на что.По умолчанию тема аккордеона также имеет закругленные углы на закрытых заголовках.

Есть ли метод стиля, который может диктовать аккордеону, что, когда он неактивен и между верхом и низом, имеет углы в 90 градусов, в то время как у основания будут закругленные углы, когда они неактивны, и углы 90 градусов, когда они активны?Или это будет более сложное упражнение с настраиваемым JavaScript?

Ответы [ 2 ]

2 голосов
/ 21 марта 2012

А как насчет использования .addClass и .removeClass для изменения CSS элемента div заголовков гармошки на основе определенных событий? Активный будет продиктован, когда на него нажимают? Неактивен, если нажать еще раз, чтобы скрыть?

Вы можете проверить элементы .parent () или .sibling (), чтобы определить, находится ли он ниже / рядом / под другими элементами div заголовка гармошки?

0 голосов
/ 21 марта 2012

Если вы ищете решение только для CSS, возможно, что-то подобное сделает то, что вы хотите: 

.accordion {
  border-radius: 10px;
}
.accordion [aria-expanded=false] {
  border-radius: 10px;
}
.accordion [aria-expanded=true] {
  border-radius: 0;
}
.accordion > [aria-expanded=false] + :last-child {
  border-radius: 10px;
}
.accordion > [aria-expanded=true] + :last-child {
  border-radius: 0;
}

Вместо .accordion вы должны поставить любой селектор, который будет соответствовать вашему аккордеону. Имейте в виду, что это не будет работать в IE8 и более ранних версиях, но должно работать в большинстве других последних браузеров. Я на самом деле не пробовал это, поэтому я не совсем уверен, будет ли это работать вообще.

...