Непоследовательный результат для мобильного класса jQuery ui-btn-active

Question

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

В исходном состоянии складная конструкция свернута, а задний фон имеет белый цвет. В развернутом состоянии фон первого элемента в списке (заголовок, который я только что щелкнул) должен измениться на сделку.

Это изменение фона работает только иногда. При использовании сенсорного устройства иногда список может расширяться и сохранять белый фон. И при свертывании этого списка, который не смог изменить фон, иногда может появиться список, у которого фоновый цвет в свернутом состоянии.

Я предполагаю, что это установлено в классе ui-btn-active:

.ui-btn-active {
   background-color: #00a99d;
   border-color: #005c56;
   color: #ffffff;
   text-shadow: 0 1px 0 #444444;
}

Но почему несоответствие? Работает 2 раза из 10.

Answer 1

Попробуйте использовать что-то вроде этого

.ui-collapsible-heading-collapsed > .ui-collapsible-heading-toggle{
    background:red;
}
.ui-collapsible-heading-toggle{
    background:yellow;
}