При обновлении страницы свернутое меню мелькает на долю секунды

  1. Биржа фриланса
  2. Веб-программирование
Завершен6 заявок370 просмотров

Добрый день Всем! Прошу Вашей помощи!!!! На сайте mm3.ru есть меню с левой стороны. Изначально оно раскрыто и широкое. Так и должно быть. Потом мы его сворачиваем по клику (.cross_block). Его свернутость сохраняется и при обновлении страницы тоже методом (localStorage) это тоже все отлично, НООО!!! только когда меню свернуто и мы обновляем страницу, это меню мелькает и становится развернутое, а потом снова закрытое/свернутое. Проблема именно в этом мелькании. 

Меню находится в сайдбаре. У него класс .col-md-3

.col-md-3 {

-ms-flex: 0 0 25%;

flex: 0 0 25%;

max-width: 25%;

}

При сворачивание меняется класс на .col-md-1

.col-md-1 {

-ms-flex: 0 0 3.333333% !important;

flex: 0 0 3.333333% !important;

max-width: 3.333333%!important;

padding:0!important;

}

Метод: 

$(function(){

$('.cross_block').click(function(){

$('.left_block').toggleClass('col-md-1');

localStorage.setItem("blockIsActive", $('.left_block').hasClass('col-md-1'));

});

var blockIsActive = localStorage.getItem("blockIsActive");

if (blockIsActive == "true") {

$('.left_block').addClass('col-md-1');

$('.left_block').removeClass('col-md-3');

}

});

Пробовал в DOM добавлять атрибуты ширины классу .col-md-1 style="max-width" - только этот атрибут к диву не добавляется.

Мысли: Понимаю что изначально страница загружается и берет код HTML, а затем подгружаются измененные стили. НЕ могу прощупать логику, кто сталкивался с этой проблемой!??? Очень надеюсь на Вас ГУРУ!!!! ЗАРАНЕЕ ОГРОМНОЕ СПАСИБО.

Пробовал blockIsActive !== "false" сделать изначально его свернутым но раскрывать при загрузке. Все получается в точности наоборот. Когда свернутое меню при обновлении не скачет. Но скачет при первой загрузке от изначально свернутого до развернутого. 

Так же скачет логотип...потому что скачет боковое меню.

HTML
5 лет назад
Locosa7
Михаил 
44 года
8 лет в сервисе
Был
4 года назад

Выбранный исполнитель

Rulya_CRX
Руслан 
40 лет
13 лет в сервисе
Был
21 день назад
5 лет назад
$20
1 день
Escrow
Работу сделал в срок и качественно. Спасибо большое)
Сотрудничество прошло удачно.

Заявки фрилансеров

Rulya_CRX
Руслан 
40 лет
13 лет в сервисе
Был
21 день назад
5 лет назад