jquery для ночного режима и дневного режима с кнопками - PullRequest
1 голос
/ 18 июня 2020

Я хочу добавить две кнопки в дневном режиме HTML страницы и ночном режиме, и результат должен быть при нажатии дневного режима, тогда он должен иметь белый фон вместе с черным цветом текста и в ночном режиме темный фон вместе с белым текстом Я пробовал, но безуспешно, может кто-нибудь помочь

function dark() {
  $("#dark").click(function() {
    $('body').addClass('night');
    $('div').addClass('night');
    $('li').addClass('night');
  });
};

function day() {
  $("#day").click(function() {
    $('body').removeClass('night');
    $('div').removeClass('night');
    $('li').removeClass('night');
  });
};
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="day" onclick="day();">Day Mode</button>
<button id="dark" onclick="dark();">Night Mode</button>

1 Ответ

0 голосов
/ 18 июня 2020

можно сделать так:

function theme(color){
      $('body').attr('class',color);
}
.day {
  background: white;
  color:black;
}

.dark{
  background: black;
  color:white;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button onclick="theme('day');">Day Mode</button>
<button onclick="theme('dark');">Night Mode</button>


<br><br>
<span>Some text !!</span>
...