В настоящее время я внедряю переключатель темного / светлого режима на мою страницу.Всякий раз, когда пользователь переключает режимы, я добавляю / удаляю класс .dark-mode в body, а затем изменяю свойство, используя body.dark-mode .elementSelector.
. Я также хочу, чтобы переход постепенно исчезал, т.е. не переключался напрямую, а имел хороший переходмежду ними.Чтобы это работало, я использую
* {
transition: all 0.5s ease-in-out;
}
. При использовании этого в Firefox это дает желаемый эффект, однако при использовании Chrome или Safari переходы происходят один за другим, сначала переходя на фон тела,затем мои заголовки, затем текст, затем ссылки и т. д. Можно ли заставить Chrome и Safari воспроизводить все переходы одновременно?
Простой пример этого механизма в действии: https://jsfiddle.net/xzw793L4/1/