При смене темы сайта после обновления страницы мелькают старые стили, как исправить?

Question

[Alexfixer]

После смене темы сайта на ночную, когда обновляю страницу, на 1 секунду мелькают старые стили, подскажите как исправить это?

.body-night.active {
	background-color: #171c20; 
}

$(document).ready(function() { 
      if (localStorage.getItem('body-night') == 'active') {
        $('.body-night').addClass('active');
      }
});
// добавление к body класса active
$(".night-user_theme").click(function() {
     $('.body-night').toggleClass('active');
      if (localStorage.getItem('body-night') == 'active') {
        localStorage.removeItem("body-night", "active");
      } else {
        localStorage.setItem("body-night", "active");
      }
});

Comments

[Alexfixer]

подключение js файла в head не помогает

[Alexfixer]

Всем спасибо за помощь!)

Answer 1

[Вова Дружаев]

$(document).ready(function()
- это медленно.
Эту проверку убери и внутри что на jquery - добавление класса - сделай на чистом js.
Так ты не будешь ждать когда сам jquery загрузится и скажет "я и док готов"

Answer 2

[Andrey Suha]

Почему не сохранят выбранную тему в куки и возводит нужные классы средствами бекенда?

Comments

[Andrey Suha]

Sniggering Ewigkeit, чем легче? Строчку кода сэкономите, если сэкономите? Зачем сразу что-то менять на фронте? если выбрана темная тема то и должна рендерится темная, а не светлая, а потом меняется на темную. Если на стороне Бека нету возможности, то другой вопрос, хотя странно что ее нету.

[Andrey Suha]

Sniggering Ewigkeit, а я и не спорю, Вы спросили зачем я ответил

[Andrey Suha]

Sniggering Ewigkeit, и Вас так же))