Здравствуйте.
Решил поработать на чистом JS, и возник банальный вопрос, который не могу понять как решить:
Есть две функции, одна открывает, вторая закрывает Боковое меню:
function openNav() {
document.getElementById("mySidenav").style.width = "250px";
document.getElementById("main").style.marginLeft = "250px";
document.getElementById("mySidenav").className += ' mySidenavOpen';
document.getElementById("opener").style.display = "none";
}
function closeNav() {
document.getElementById("mySidenav").style.width = "0";
document.getElementById("main").style.marginLeft = "0";
document.getElementById("mySidenav").classList.remove("mySidenavOpen");
document.getElementById("opener").style.display = "block";
}
И тут столкнулся с тем, что после того, как я открыл меню, и перехожу на другую страницу (обычный сайт с шаблонами, не SPA), то, естественно, меню по умолчанию закрыто, для чего решил юзать куки:
Изменил функцию открытия меню, описанную выше, добавив в неё сэт куки:
function openNav() {
...
Cookies.set('mySidenav', 'open');
}
И перед всем этим делом, проверяю, есть ли в куках значение:
if (Cookies.get('mySidenav')) {
if (Cookies.get('mySidenav') === 'open') {
openNav();
}
}
И теперь, что очевидно, при каждой загрузке страницы, меню открывается, но только после загрузки всего JS, при этом не являясь открытым по умолчанию (при рендеринге HTML).
Подскажите, как реализовать это правильно?
Если работать с LocalStorage, то суть не поменяется, ведь нужно, в любом случае, ждать, пока по ключу будет получено значение.
Думал про прелоадер, но дело в том, что страницы сейчас грузятся крайне быстро, в связи с малым весом статики и отсутствием медиа, и не хочется портить всё это впечатление бросающейся в глаза "подгрузкой" контента.
ПРИМЕЧАНИЕ
Куки получаю при помощи js-cookie.
Все подключения js файлов идут перед закрывающимся тегом .
Ради решения этой задачи не хочу менять расположение скриптов.
Основные этапы разработки сайта для стоматологической клиники
Продвижение своими сайтами как стратегия роста и независимости