Сворачивающиеся блоки на Cookies

2761
8.2 из 10
Проголосовало: 7






сворачивающиеся/разворачивающиеся блоки на куках

Установка:

1 вариант

Установка моих сворачивающихся блоков.

Вот сам код блока (вставляете, например, в конструктор шаблонов или меняете все блоки на эти):

Code
<div class="blocks">  
<div class="btitle"><div class="bclick bclose" rel="bid1"></div>TITLE</div>  
<div class="bcontent" id="bid1">CONTENT</div>  
</div>


Здесь нужно помнить что bid1 должен быть уникальным для каждого блока, можно bid2, bid3 и т.д. Как Вам будет удобнее, но чтоб они не повторялись на странице.

Затем добавляете в CSS следущий стиль:

Code
.blocks {border:1px solid #cecece;margin:10px 4px}  
  .bclose {background: url('http://s39.ucoz.net/.s/img/icon/minus.png') no-repeat;width:16px;height:16px;float:right;cursor:pointer;margin-right:4px;}  
  .bopen {background: url('http://s39.ucoz.net/.s/img/icon/plus.png') no-repeat;width:16px;height:16px;float:right;cursor:pointer;margin-right:4px;}  
  .btitle {padding:4px;padding-left:6px;font-weight:bold;}  
  .bcontent {padding:10px;border-top:1px solid #cecece;}


Картинки можно поменять на свои.

И теперь ставите перед </body> следующий скрипт:

Code
<script type="text/javascript" src="http://webo4ka.ru/Ucoz5/trane73.bcookie_cvorachivanie_blokov.js"></script>


На этом заканчивается установка блоков с моим дизайном. Он очень прост, но имея желаение Вы можете изменить стиль под свои нужды.

2 вариант

Установка сворачивания/разворачивания на свои блоки.

В этом варианте я расскажу, как установить скрипт сворачивания разворачивания на свои блоки. Сделать это нетрудно, нужно только быть внимательным и не пропустить важного шага.

И так, первое, что нужно сделать, это установить кнопочку сворачивания/разворачивания. Для этого в код Вашего блока перед названием вставляем следующей код:

Code
<div class="bclick bclose" rel="bid1"></div>


Должно получиться примерно так:

Code
<div class="bclick bclose" rel="bid1"></div>Название блока


Затем нужно добавить код к содержанию блока. Вот пример контента блока:

Code
<div style="border-top:0;" class="xw-mc contentBg">Тут контент</div>


Нужно добавить класс и айди:

Code
<div style="border-top:0;" class="xw-mc contentBg bcontent" id="bid1">Тут контент</div>


Если уже присутствует class, то просто через пробел дописывайте его, если существует id, то его нужно убрать и поставить этот (если тот айди используется для стилей, то заменить его на class).

После чего аналогично добавляете в CSS следующий стиль:

Code
.blocks {border:1px solid #cecece;margin:10px 4px}  
  .bclose {background: url('http://s39.ucoz.net/.s/img/icon/minus.png') no-repeat;width:16px;height:16px;float:right;cursor:pointer;margin-right:4px;}  
  .bopen {background: url('http://s39.ucoz.net/.s/img/icon/plus.png') no-repeat;width:16px;height:16px;float:right;cursor:pointer;margin-right:4px;}  
  .btitle {padding:4px;padding-left:6px;font-weight:bold;}  
  .bcontent {padding:10px;border-top:1px solid #cecece;}


И перед </body> ставите всё тот же скрипт:

Code
<script type="text/javascript" src="http://webo4ka.ru/Ucoz5/trane73.bcookie_cvorachivanie_blokov.js"></script>
Автор публикации: Загрузка
Загрузка
Вовчик, это его n материал
Источник: http://trane73.ru/
  • Всего комментариев: 6

kolyan1282
0
kolyan1282 написал: Написано 19 Февраля 2012 в 12:25
Комментарий №5
Я прописал, не сохраняется

kolyan1282
0
kolyan1282 написал: Написано 19 Февраля 2012 в 11:31
Комментарий №4
У меня все работает, но после обновления страницы свернутый блок опять открывается! Что делать??? ПОМОГИТЕ!!!! Заранее СПАСИБО

Kavrasky
0
Kavrasky написал: Написано 27 Ноября 2011 в 17:05
Комментарий №1
не пашет...

doc74
+1
doc74 написал: Написано 01 Января 2012 в 18:54
Комментарий №2
Не знаю на счёт 1-го, а 2-й способ точно работает! cool

k43
0
k43 написал: Написано 21 Января 2012 в 06:47
Комментарий №3
1 способ тоже робит dry

carateli44
0
carateli44 написал: Написано 03 Июля 2013 в 14:26
Комментарий №6
2-й робит!! cool

  • Оставить комментарий:
Добавлять комментарии могут только зарегистрированные пользователи.
Регистрация | Вход
Меню сайта
Категории
Для помощи создания сайта uCoz 25
Скрипты и модификации для Ucoz 2116
Шаблоны форумов Ucoz 28
Шаблоны сайтов Ucoz 431
Авторство Webo4ki 309
php скрипты для ucoz 57
Графика для uCoz 40
Мини-чат
Последние комментарии
Добрый вечер.Подскажите,пожалуйста: как сделать, чтобы второй или третий набор смайлов заменить своими.
Вы сами себе пишите?
  • CbIPoK2513 написал:
  • Скрипт хорош, уже подстроил свой сайт под него :3
  • gefest35 написал:
  • Супер)))!пасиб за работу!!!
  • sasha2016tv написал:
  • Хороший скрипт
    Последние темы
    Опрос
    447
    А
    Р
    Оцените новый дизай:)
    Статистика
    Анализ интернет сайта
    0
    онлайн
    0
    наших
    0
    чужих
    Онлайн всего: 9
    Гостей: 7
    Пользователей: 2
    0
    Сегодня были
    Топ пользователей: