Скрипты для uCoz, Шаблоны для uCoz, Видео Уроки, Статьи

Главная » Файлы » Скрипты для uCoz

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

	13.06.2011, 19:04
Сегодня написал сам скрипт и инструкцию по установке сворачивающихся/разворачивающихся блоков для любых сайтов. Скрипт очень простой, но если ставить не на uCoz, то нужно подключить jQuery. Сам скрипт взял из паблик-шаблона, сам же только переписал функции под более удобное использование. 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://trane73.ru/demo/blocks/m.png') no-repeat;width:16px;height:16px;float:right;cursor:pointer;margin-right:4px;} .bopen {background: url('http://trane73.ru/demo/blocks/p.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://trane73.ru/demo/blocks/trane73.bcookie.js"></script> На это всё =) В этих блоках полностью мой стиль, он очень прост и лаконичен, но если есть желание и знания, то изменить их под себя не составит труда. 2 вариант (подгонка под свои блоки). Установка сворачивания/разворачивания на свои блоки. В этом варианте Вы узнаете как установить этот скрипт на свои, уже имеющиеся блоки. Сделать это не трудно, если иметь начальные знания HTML и CSS. Первое, что нужно сделать, это установить кнопку сворачивания/разворачивания наших блоков. Для этого перед названием блока вставляем следующей код: 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 .bclose {background: url('http://trane73.ru/demo/blocks/m.png') no-repeat;width:16px;height:16px;float:right;cursor:pointer;margin-right:4px;} .bopen {background: url('http://trane73.ru/demo/blocks/p.png') no-repeat;width:16px;height:16px;float:right;cursor:pointer;margin-right:4px;} И перед < /body> ставите всё тот же скрипт: Code <script type="text/javascript" src="http://trane73.ru/demo/blocks/trane73.bcookie.js"></script> Вот и всё =) Автор: TRANE73 Страница с демо: ТУТ Скачать Сворачивающиеся блоки на Cookies by TRANE73 Зеркало Сворачивающиеся блоки на Cookies by TRANE73 Источник: http://trane73.ru/publ/1-1-0-48
1 2 3 4 5 Категория: Скрипты для uCoz \| Добавил: TRANE73 \| Теги: cookies, TRANE73, Сворачивающиеся, блоки, By, на, скрипты для Ucoz
Просмотров: 1360 \| Загрузок: 0 \| Рейтинг: 0.0/0

Всего комментариев: 0

Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]

Зачекай

Поиск

Скрипты для uCoz

Красивый мини-профиль

Скрипт Мини-Профиль для uCoz

Скрипт Твой профиль на сайте для uCoz

Скрипт Смайл настроения v1.0 для uCoz

Скрипт flash календарь для uCoz

Шаблоны для uCoz

Шаблон Очень красивый шаблон на тему wow для Ucoz бесплатно! Адаптированный с DLE. для uCoz

Шаблон Rip Crove.Ru для uCoz

Шаблон для сайта

PSD макет от winskin " Need For Speed " design

Друзья сайта

ucoz — это бесплатная система управления сайтом и хостинг для сайтов. ucoz сайты - это просто, удобно и быстро. Здесь вы можете создать бесплатные сайты на любую из интересующих вас тем, домен и хостинг предоставляются также бесплатно. На нашем сайте вы найдете скрипты для ucoz для удобства оформления вашего сайта. Кроме того, мы предлагаем на ваш выбор шаблоны для ucoz по различной тематике и цветовой гамме. Выбор темы для ucoz зависит только от вас. Это могут быть такие дизайны для ucoz, как природа, недвижимость, музыка, игры, транспорт, спорт и многие другие. Также вы можете найти различные виды меню для ucoz, чтобы улучшить внешний вид вашего сайта. Для создания особого стиля вашего сайта и для того, чтобы соответствовать основной тематике, у нас вы можете найти шапки для ucoz. Если у вас возникнут какие-либо трудности в создании сайтов, смотрите видео уроки для ucoz. При необходимости вы можете скачать видео уроки на нашем сайте. Конструктор ucoz, предлагаемый нашим сайтом, позволяет даже новичку создать хороший сайт с большими возможностями. Мы желаем вам успехов в создании сайтов с помощью script.ucoz.lv.

Скрипты, Шаблоны, Уроки для uCoz

Скрипты для uCoz, Шаблоны для uCoz, Видео Уроки, Статьи