Задать вопрос
AleksMey
@AleksMey
Пытаюсь разобраться

Знает кто js скрипт смены темы, который стабильно работает при переходе по страницам?

Ребят, подскажите скрипт для смены темы на тёмную, который при переходе по страница не будет сбрасываться. Все скрипты которые юзал, при переходе по страницам на долю секунды сбрасывается и показывается светлая, если находишься в тёмной и наоборот.

Сейчас использую этот:
// Theme swither

function setDarkTheme()
{
    document.documentElement.classList.remove("light");
    document.documentElement.classList.add("dark");
    localStorage.setItem("theme", "dark");
}

function setLightTheme()
{
    document.documentElement.classList.remove("dark");
    document.documentElement.classList.add("light");
    localStorage.setItem("theme", "light");
}

function setPreferredTheme()
{
    if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
      setDarkTheme();
    } else {
      setLightTheme();
    }
}

function isDarkTheme()
{
  return localStorage.getItem("theme") == "dark";
}

function setChoosenTheme()
{
    let theme = localStorage.getItem("theme");
  
    if (theme == "dark")
    {
        setDarkTheme();
    } else if (theme == "light")
    {
        setLightTheme();
    }
    else
    {
        setPreferredTheme();
    }
}

function toggleDarkMode() {
  if (isDarkTheme()) {
    setLightTheme();
  } else {
    setDarkTheme();
  }
}

window.matchMedia('(prefers-color-scheme: dark)').onchange = (e) => setChoosenTheme();

setChoosenTheme();
  • Вопрос задан
  • 80 просмотров
Подписаться 1 Простой Комментировать
Помогут разобраться в теме Все курсы
  • Нетология
    Веб-разработчик с нуля: профессия с выбором специализации
    14 месяцев
    Далее
  • Яндекс Практикум
    Фронтенд-разработчик расширенный
    13 месяцев
    Далее
  • Skillbox
    JavaScript
    3 месяца
    Далее
Пригласить эксперта
Ваш ответ на вопрос

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

Похожие вопросы