При обновлении страницы свернутое меню мелькает на долю секунды
Бюджет $10-30 USD
- Freelancer
- Работа
- PHP
- При обновлении страницы свернутое меню мелькает на долю секунды
Добрый день Всем! Прошу Вашей помощи!!!! На сайте [login to view URL] есть меню с левой стороны. Изначально оно раскрыто и широкое. Так и должно быть. Потом мы его сворачиваем по клику (.х_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(){
$('.х_block').click(function(){
$('.left_block').toggleClass('col-md-1');
[login to view URL]("blockIsActive", $('.left_block').hasClass('col-md-1'));
});
var blockIsActive = [login to view URL]("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" сделать изначально его свернутым но раскрывать при загрузке. Все получается в точности наоборот. Когда свернутое меню при обновлении не скачет. Но скачет при первой загрузке от изначально свернутого до развернутого.
Так же скачет логотип...потому что скачет боковое меню.
5 фрилансеров(-а) готовы выполнить эту работу в среднем за $14
Validcode is a dynamic and fast-moving company in Web/Mobile designing and development world-wide and has proven itself to be one of the best in markets. Validcode have served customers from USA , Canada , Germany , UK Больше
Здравствуйте. Обращайтесь, сделаю. Скачет из-за того что js выполняется на долю секунды позже в отношении отображения html + css . Есть разные варианты, но лучше всего сделать хранения статуса в кукиз и классы выводить Больше
Привет сделаю без бекенд скриптов на чистом цсс без перекомпоновки очереди подгрузки цсс и скриптов.