Всем Привет!
имеется скрипт:
$('.collapse-link').on('click', function () {
var ibox = $(this).closest('div.ibox');
var button = $(this).find('i');
var content = ibox.children('.ibox-content');
content.slideToggle(200);
button.toggleClass('fa-arrows-v').toggleClass('fa-arrows-v');
ibox.toggleClass('').toggleClass('border-bottom');
setTimeout(function () {
ibox.resize();
ibox.find('[id^=map-]').resize();
}, 50);
var info;
if(content.css("display") == none)
{
info = none;
}
else
{
info = ok;
}
localStorage.setItem(ibox.id,info);
});
html блока:
<div class="ibox">
<span class="collapse-link">
<div class="ibox-title">
<h5 style="">Title</h5>
<div class="ibox-tools">
<i class="fa fa-arrows-v"></i>
</div>
</div>
</span>
<div id="block-1" class="ibox-content">
Text
</div>
</div>
И собственно скрипт при загрузке страницы:
$(document).ready(function() {
var block1 = localStorage.getItem('block-1');
if(block1 == none)
{
var ibox = getElementById("block-1");
ibox.addClass("block-hide");
}
else:
{
continue;
}
});
На сайте имеются несколько блоков, состоящих из Заголовка и Контента.
Первоначально, при заходе на сайт пользователь видит и текст и заголовок. При клике(onClick скрипт) контент скрывается, при повторном - открывается. Я сохраняю в localStorage id блока и его текущее состояние. Далее при перезагрузке страницы я проверяю положение блока(открыт/закрыт), если он был скрыт(info = none) я добавляю class с display:none и скрываю его, в противном случае не делаю ничего. Js изучаю недавно, поэтому с большего хочу с этим разобраться, нежели просто получить ответ
. Сам onClick скрипт без сохранения открыт/закрыт рабочий. В localStorage храниться массив из id+info.