Slidetoogle сохранение положения

Дата: Среда, 21.07.2010, 13:32 | Сообщение # 1

Offline

Супер чел

Script Creator

Сообщений:	420
Награды:	15
Замечания:	0%

Репутация
231

Многие используют slidetoogle для экономии места на сайте. Вот стандартный код:

Code

<a onclick="$('#ID').slideToggle('slow');" href="javascript://">Текст ссылки</a>

<div id="ID" style="display: none;">Содержимое блока</div>

А можно ли сделать так, чтобы при сворачивании/разворачивании блоков их состояние запоминалось браузером, и при обновлении страницы свёрнутые блоки оставались свёрнутыми, а развёрнутые - развёрнутыми?

Дата: Среда, 21.07.2010, 14:46 | Сообщение # 2

Offline

BrainStorming

Администраторы

Сообщений:	2847
Награды:	51

Репутация
987

Тут на куках нужно.

1) Подключи jq и cookies:

Code

2) Перед блоком вставь этот скрипт:

Quote

Там, где красным - это ID блока

Автор этого скрипта X-3me (я просто его на div'ы переделал).

3) А сам блок оформляй так:

Quote

<div id="my-menu">
<a href="javascript://">Текст ссылки</a>
<div>Содержимое блока</div>
</div>

Если я долго не выполняю обещаний, напомните мне в ЛС. Скорее всего, я просто забыл.

Не оказываю помощь через ЛС. Все вопросы - на форум или в комментарии.

Дата: Четверг, 22.07.2010, 18:59 | Сообщение # 3

Offline

Супер чел

Script Creator

Сообщений:	420
Награды:	15
Замечания:	0%

Репутация
231

Спасибо!

Добавлено (22.07.2010, 18:59)
---------------------------------------------
Не работает sad

Поставил на тестовую страницу:

Дата: Пятница, 23.07.2010, 10:47 | Сообщение # 4

Offline

BrainStorming

Администраторы

Сообщений:	2847
Награды:	51

Репутация
987

7soft, так попробуй:

Code

Дата: Пятница, 23.07.2010, 10:56 | Сообщение # 5

Offline

BrainStorming

Администраторы

Сообщений:	2847
Награды:	51

Репутация
987

Кажется понятно, в чем дело. Содержимое div тоже должно быть ссылкой:

Quote

<div id="my-menu">
<a href="javascript://">Текст ссылки</a>
<div><a href="javascript://">Содержимое блока</a></div>
</div>

Дата: Пятница, 23.07.2010, 11:01 | Сообщение # 6

Offline

Супер чел

Script Creator

Сообщений:	420
Награды:	15
Замечания:	0%

Репутация
231

Вот что получается:

Дата: Пятница, 23.07.2010, 11:14 | Сообщение # 7

Offline

BrainStorming

Администраторы

Сообщений:	2847
Награды:	51

Репутация
987

Вообщем вот, нашел решение:

В head подключи jq:

Code

Затем, туда, где нужен блок, ставь это:

Quote

<a href="javascript://" onclick="cookieToggle('infoblock')">Текст</a>
<div id="infoblock">123</div>

if ($.cookie('hideid_'+id)!=null) {$.cookie('hideid_'+id, null);} else {$.cookie('hideid_'+id, '');}

$('#'+id).slideToggle(100);
}
cookieToggleCheck = function(id) {

if ($.cookie('hideid_'+id)!=null) {$('#'+id).hide();}
}
cookieToggleCheck('infoblock');
</script>

Красное - это ID

Прикрепления: jquery.cookie.js (1.8 Kb)

Дата: Пятница, 23.07.2010, 11:30 | Сообщение # 8

Offline

Супер чел

Script Creator

Сообщений:	420
Награды:	15
Замечания:	0%

Репутация
231

Работает! Спасибо, держи плюс!

Добавлено (23.07.2010, 11:30)
---------------------------------------------
Последний вопрос, можно ли сделать так:

Code

<a href="javascript://" onclick="cookieToggle('infoblock')">Текст</a>
<div id="infoblock">123</div>

<script type="text/javascript" src="http://x-3me.ru/js/jquery.cookie.js"></script>
<script type="text/javascript">
cookieToggle = function(id) {

if ($.cookie('hideid_'+id)!=null) {$.cookie('hideid_'+id, null);} else {$.cookie('hideid_'+id, '');}

$('#'+id).slideToggle(100);
}
cookieToggleCheck = function(id) {

if ($.cookie('hideid_'+id)!=null) {$('#'+id).hide();}
}
cookieToggleCheck('infoblock');
cookieToggleCheck('infoblock1');
cookieToggleCheck('infoblock2');

</script>

Чтобы работало и для других блоков.

Сообщение отредактировал 7soft - Пятница, 23.07.2010, 11:44

Дата: Пятница, 23.07.2010, 19:12 | Сообщение # 9

Offline

BrainStorming

Администраторы

Сообщений:	2847
Награды:	51

Репутация
987

7soft, можно.

komar

Дата: Пятница, 18.02.2011, 17:17 | Сообщение # 10

Offline

Свой человек

Продвинутые

Сообщений:	712
Награды:	6
Замечания:	0%

Репутация
168

Как данный скрипт адаптировать под разделы форума на ucoz?

Добавлено (07.02.2011, 11:01)
---------------------------------------------
Ну подскажите плиз... или хоть скажите в каком направлении двигаться?

Добавлено (18.02.2011, 17:17)
---------------------------------------------
Нашел я решение своей проблемы, вот скрипт сворачивания и разворачивания разделов форума с запоминанием позиции:

Code

<div id="forumbody">$BODY$</div><style type="text/css">
.gTopCornerRight {display:none;}
</style>
<script type="text/javascript" src="http://soft-blog.do.am/toggleforums.js"></script>

Но есть одно НО, работает он вроде нормально, проверял в Опере, IE и лисе, НО мне не надо чтобы отображались + или - если чя захожу в сам раздел, т.к. это бестолково... Мне нужно чтобы данный скрипт работал только на главной странице форума, поможете? Думаю надо что-то менять в js файле...

Дата: Пятница, 18.02.2011, 18:02 | Сообщение # 11

Offline

BrainStorming

Администраторы

Сообщений:	2847
Награды:	51

Репутация
987

Code

<div id="forumbody">$BODY$</div><?if($URI_ID$='frMain')?><style type="text/css">
.gTopCornerRight {display:none;}
</style>
<script type="text/javascript" src="http://soft-blog.do.am/toggleforums.js"></script><?endif?>

Quote (komar)

Нашел я решение своей проблемы

Вот только скажи, чем он отличается от этого?

komar

Дата: Пятница, 18.02.2011, 18:22 | Сообщение # 12

Offline

Свой человек

Продвинутые

Сообщений:	712
Награды:	6
Замечания:	0%

Репутация
168

Quote (antisept)

Вот только скажи, чем он отличается от этого?

Ничем... блин, но раньше я его не видел или смотрел не внимательно...