#javascript #html #css
#javascript #HTML #css
Вопрос:
(Пример) Итак, у меня есть переходы, скажем, для <p> элемента моего сайта. .invert переключает его с красного на синий. У меня есть функция JS с именем invert() , и она запускается сразу, но я хочу invert() переключить ее без переходов, если это сделано при загрузке страницы.
elm = document.getElementById("invert");
function invert() {
elm.classList.toggle("invert");
}
invert(); p {
color: red;
font-size: 150%;
transition: color 1s;
}
p.invert {
color: blue;
} <p id="invert">peanut</p>
<button onclick="invert()">butter</button> Фрагмент кода этого не делает, но вы поняли идею! : P Просто представьте, что при выполнении кода происходит переход, когда я вызываю invert() , чтобы он фактически переключался с красного на синий. Я могу дать вам код для сайта, если хотите.
Помощь была бы очень признательна! Спасибо за ваше время!
Комментарии:
1. mtm828.github.io Посмотрите, как он переключает темный режим, если у вас был включен темный режим при последнем посещении сайта? Я хочу остановить переход, если он это делает.
2. зачем изначально применять класс invert?
3. @TemaniAfif wdym? Также это всего лишь пример, то, что я действительно пытаюсь сделать, это mtm828.github.io .
4.
<p class="invert" id="invert">peanut</p>5. @SnareHanger Эм, нет, это не подходит для моей темной темы.
Ответ №1:
Вы должны отменить переход непосредственно перед инвертированием цвета, а затем установить его снова:
elm.style.transition = '0s';
invert();
elm.style.transition = 'color 1s';