Сохранение свойства css в cookie
Всем доброго времени суток! Прошу помощи в решении небольшой и простой задачи. Найденные решения для аналогичных задач приспособить для моей задачи не получается в виду отсутствия знаний JS.
Сайт: http://postscriptuum.com/photo Есть "кнопка" - она скрывает div HTML: <a id="linkEvent" onClick="hide_show();return false;">Закрыть</a> JS код (частично взят с другого ресурса)
function hide_show()
{
//Получаем стиль блока с айди divEvent (для изменения)
var divEvent=document.getElementById("divEvent").style.display;
//Получаем стиль ссылки (для изменения)
var linkEvent=document.getElementById("linkEvent").innerHTML;
var linkEventFon=document.getElementById("linkEvent").style.backgroundColor;
//Изначально стиль display у блока равен ""
//так как он изначально отображается
//задаем ему стиль block
if(divEvent=="")divEvent="block";
//Если блок не отображается
if(divEvent=="none")
{
divEvent="block";
linkEvent="Закрыть";
linkEventFon='#f1f1f1';
}
//или наоборот
else
{
divEvent="none";
linkEvent="Открыть";
linkEventFon='#ffffff';
}
//Теперь меняем стили у ссылки
//и блока который хотим скрыть или показать
document.getElementById("divEvent").style.display=divEvent;
document.getElementById("linkEvent").innerHTML=linkEvent;
document.getElementById("linkEvent").style.backgroundColor=linkEventFon;
Задача: как сделать так, чтобы изменения состояния display записывались в cookie? в JS практически не разбираюсь и прошу помощи. |
doomgart,
http://learn.javascript.ru/cookie Вообще я больше предпочитаю использовать стореджи, нежели куки, если надо просто записывать и считывать значения в пределах домена. Но если стореджи не поддерживаются из-за древности браузера, тогда можно прибегать к кукам... |
Спасибо за статью, только человеку, мало понимающему JS, статья не сильно помогает. Поэтому, если кто-то может, подскажите более конкретно.
|
doomgart,
Функция setCookie(name, value, options) --- копипастишь ее читаешь "Запись в document.cookie", какие параметры бывают Передаешь эти три параметра...среди которых вместо value передать divEvent, в котором лежит block, none или пустое |
Вот, большое спасибо!
|
В конце документа, или в обработчик события DOMContentLoaded добавляешь код:
if (localStorage.hasOwnProperty('divEventHidden')) {
hide_show(); // вообще, более удачное имя - toggle
}
А в саму функцию hide_show добавляешь строчки: в блоке if - localStorage.setItem('divEventHidden', null); в блоке else - localStorage.removeItem('divEventHidden'); |
Закинул код, что-то не работает.
" В конце документа, или в обработчик события DOMContentLoaded добавляешь код: if (localStorage.hasOwnProperty('divEventHidden')) { hide_show(); // вообще, более удачное имя - toggle } " Это можно закинуть в конец html странички и заключить в теги <script>, или нужно добавить что-то ещё? |
Цитата:
<body onload="hide_show();return false;"> Работает. Если добавить window.onload = hide_show; вниз странички, тоже работает. Но оба способа работают только с if (localStorage.hasOwnProperty('divEventHidden')) { hide_show(); } - и я не понимаю, почему. Так же, при медленном интернет-соединении div то появляется, то исчезает, можно ли избежать такого поведения? |
doomgart,
Так же, при медленном интернет-соединении div то появляется, то исчезает, можно ли избежать такого поведения? --- сделайте по умолчанию скрытым и отображайте только тогда, когда необходимо... ну или вообще генерируйте контент на ходу в местах, где он может присутствовать или отсутствовать в зависимости от полученных параметров... |
Цитата:
Вопрос: 1. Будет ли с cookie работать быстрее, или нет? 2. Зачем нужна строка
if (localStorage.hasOwnProperty('divEventHidden')) {
hide_show();
}
если есть <body onload="hide_show();return false;"> или window.onload = hide_show;? |
| Часовой пояс GMT +3, время: 12:05. |