Как правильно работать со значением по умолчанию при загрузке страницы?

237
17 июля 2017, 17:02

Здравствуйте. Решил поработать на чистом 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 файлов идут перед закрывающимся тегом .

Ради решения этой задачи не хочу менять расположение скриптов.

READ ALSO
Angular 4, Как получить данные из файла index.html

Angular 4, Как получить данные из файла index.html

В программу нужно передавать некоторый параметр, но передача должна осуществляться из файла indexhtml, то есть из файла на котором располагается...

301
Удаление элементов из массива в AngularJs

Удаление элементов из массива в AngularJs

Помогите решить проблему

359
Появление бордера при скролле у дива [требует правки]

Появление бордера при скролле у дива [требует правки]

Надо чтобы при скролле вниз ,у нужного блока появлялся бордер,а когда я спускаюсь еще ниже этого блока бордер исчезал и так постоянно

218
Как добавить карту гугл без интерфейса и с подписью под маркером

Как добавить карту гугл без интерфейса и с подписью под маркером

Вообщем, мне нужно на сайт добавить гугл карту

296