Здравствуйте Дорогие Профессионалы!
Прошу вашей помощи в моей проблеме, задача состоит в том чтобы менять цвет текста и фона, при раскрытии списка меняется цвет фона и текста, при закрытии меняется обратно в исходное состояние, у меня не получается : 1) чтобы цвет менялся только у того блока который был нажат.
2) При первом клике цвет меняется, а при повторном ничего не происходит) ПРошу пожалуйста помочь, намучался уже с этой проблемой… https://codepen.io/Alfa_main/pen/ZdxOVg
Можно теоретически тем же путем, которым была сделана анимация: использовать комбинацию селектора :checked
и ~ вместо +
- Я изменил порядок html элементов
- Заменил
+
на~
- Дописал еще одно правило для изменения фона
https://codepen.io/anon/pen/ydKarV
Если бы я решал эту задачу, я бы написал такой js, который добавит класс к расскрытому элементу, и уберет класс когда элемент нужно “схлопнуть”. И уже к этому классу привязывал бы фон и анимацию. Так будет меньше завязки на структуру DOM (селекторы ~ и + чувствительны к этому).
1 лайк
Спасибо большое) все очень понятно объяснили, все получилось) буду теперь знать как с таким работать)