Как предотвратить изменение CSS, когда нажата другая вкладка (ссылка) и пользователь остается на той же странице? - PullRequest
Новая
       1

Как предотвратить изменение CSS, когда нажата другая вкладка (ссылка) и пользователь остается на той же странице?

0 голосов
/ 23 сентября 2019

Я сделал кнопку, и когда она нажата, цвета моего сайта изменятся (что отлично работает).Однако, если щелкнуть ссылку или обновить страницу, она не сохранит новые значения цвета CSS, а просто вернется к тому, как выглядит страница по умолчанию.Пожалуйста, дайте мне знать, как я могу сохранить эти значения, чтобы они не менялись при обновлении страницы или при нажатии на вкладку.Я ценю любую помощь, которую вы можете оказать :)

Спасибо!

function toggleDarkLight(event) {
  var body = document.getElementById("body");
  var currentClass = body.className;
  body.className = currentClass == "dark-mode" ? "light-mode" : "dark-mode";
 }

<body id="body" class="light-mode">
<button type="button" name="dark_light" onclick="toggleDarkLight()" title="Toggle dark/light mode">dark</button></body>

1 Ответ

1 голос
/ 24 сентября 2019

Вы должны использовать localStorage 

document.body.onload=function(){
        var mode = localStorage.getItem("mode")=="" ? mode="light-mode" :  mode=localStorage.getItem('mode');
        var body = document.getElementById("body");
        body.className = mode;
    }

    function toggleDarkLight(event) {
        var body = document.getElementById("body");
        var currentClass = body.className;
        body.className = currentClass == "dark-mode" ? "light-mode" : "dark-mode";
        localStorage.setItem("mode",body.className)
    }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...