@JolyCode

Почему hover перестает работать после функции, в которой меняется стиль html?

Я создал кнопку в html через input type задав функцию в onclick (назвал её darkmode)
и в JavaScript этот переключатель меняет цвет других кнопок(на которых написан hover, этот hover меняет цвет при наведении).
Так вот, после того, как я нажимаю на переключатель darkmode(меняется background-color и color кнопок, на которых стоит hover) цвет при наведении курсором на кнопку не меняется.
Код переключателя darkmode
<label class="switch"><input type="checkbox" onclick="darkmode()"><span class="slider">

@mixin button {width:250px;height: 40px; font-size: $smallF;font-family: $titF; background-color: $Dark; color: white; position: absolute; top: 150px; border-radius: 10px;&:hover{transition: 0.5s ease 0.1s; background-color: red;}}
.button_EGS {@include button; left: 30%;}

//Темный режим
function darkmode(){
    if(h.innerHTML==='Светлый режим') //Да, оттого что у меня есть div с текстом "Светлый режим" я меняю цвет
    {document.body.style.backgroundColor = '#212121';

    h.innerHTML='Темный режим';h.style.color='#dcddd8';

    [passEGS, passSteam, passgoogle, passspotify,passds].forEach(element => {element.style.color = '#f2f3f4'});
    [btnEGS,btnSteam,btnGoogle,btnSpotify,returnbtn,btnDS].forEach(element => {element.style.backgroundColor ='#f2f3f4';element.style.color = 'black'})}
   
    else
    {document.body.style.backgroundColor = '#CCCCCC';
    h.innerHTML='Светлый режим';h.style.color='black';
    [passEGS, passSteam, passgoogle, passspotify,passds].forEach(element => {element.style.color = 'Black'});
    [btnEGS,btnSteam,btnGoogle,returnbtn,btnSpotify,btnDS].forEach(element => {element.style.color ='#f2f3f4';element.style.backgroundColor = 'black'});}}
  • Вопрос задан
  • 66 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы