Видео урок открывания и закрывания блоков сайта с куками.
Много пользователей задавали такой вопрос как создать подобное и без ошибок, в итоге я решил сделать видео урок простенький с простым объяснением о том как сделать подобное на своем сайте, Весь принцип не сложен, главное внимательно подойти к тому что у каждого блока должен быть
индивидуальный номер id что бы блоки были независимыми каждый для себя.
Этот способ можно так же приделать и к
виду новостей, но там уже в замен цифр нужно вставить $ ID $ который будет автоматом подставляться цифрой своего блока и что даст каждому блоку свое уникальное имя.
Видео урок создан и снят на сайте www.ucozon.ru
Автор Видео урока mdbaner
Время видео урока 6:40 мин
Примеры установки из урока
Это мы вставляем в начало контейнера первого
Code
<script language="javascript" type="text/javascript" src="http://ucozon.ru/glavnaja/img/mediaportal.js"></script>
Этот код мы вставляем в самый низ вашего сайта, то есть под последний блок
Code
<script type="text/javascript">hide_hidded_blocks_divs();</script>
далее приступаем к редактированию блоков
вот сам блок стандартный:
Code
<!-- <block9> -->
<table border="0" cellpadding="0" cellspacing="0" class="block"><tbody>
<tr><td class="block_top"><!-- <bt> --><!--<s3163>--> Категорий MP3<!--</s>--><!-- </bt> --></td></tr>
<tr><td class="block_middle"><div align="center"><!-- <bc> -->$CATEGORIES$<!-- </bc> --></div></td></tr>
<tr><td class="block_bottom"></td></tr></table>
<!-- </block9> -->
а вот я его изменил , то есть удвоил и обделил именами индивидуальными
Code
<!-- <block9> -->
<div style="" id="fo_block_mediaportal_calendar2">
<table border="0" cellpadding="0" cellspacing="0" class="block"><tbody>
<tr><td class="block_top"><!-- <bt> --><!--<s3163>--> <img src="http://avtos.do.am/img/bloc1/minus.gif" class="icon_show_hide" onclick="javascript:toggleblock('block_mediaportal_calendar2', 1);" title="Свернуть блок"> Категорий MP3<!--</s>--><!-- </bt> --></td></tr>
<tr><td class="block_middle"><div align="center"><!-- <bc> -->$CATEGORIES$<!-- </bc> --></div></td></tr>
<tr><td class="block_bottom"></td></tr></table></div>
<div style="display: none;" id="fc_block_mediaportal_calendar2">
<table border="0" cellpadding="0" cellspacing="0" class="block"><tbody>
<tr><td class="block_top"><!-- <bt> --><!--<s3163>--> <img src="http://avtos.do.am/img/bloc1/plus.gif" class="icon_show_hide" onclick="javascript:toggleblock('block_mediaportal_calendar2', 0);" title="Развернуть блок"> Категорий MP3<!--</s>--><!-- </bt> --></td></tr>
<tr><td class="block_middle"><div align="center"><!-- <bc> --><!-- </bc> --></div></td></tr>
<tr><td class="block_bottom"></td></tr></table></div>
<!-- </block9> -->
то есть таким образом где все имена ID заканчиваются на цифру 2, Это важно, следующий блок будет заканчиваться на цифру 3 и так далее
Code
<!-- <block9> -->
<div style="" id="fo_block_mediaportal_calendar2">
<img src="http://avtos.do.am/img/bloc1/minus.gif" class="icon_show_hide" onclick="javascript:toggleblock('block_mediaportal_calendar2', 1);" title="Свернуть блок">
</div>
далее идет второй копия контейнер но уже без содержимого которое заключено между тегами <!-- <bc> --><!-- </bc> -->
<div style="display: none;" id="fc_block_mediaportal_calendar2">
<img src="http://avtos.do.am/img/bloc1/plus.gif" class="icon_show_hide" onclick="javascript:toggleblock('block_mediaportal_calendar2', 0);" title="Развернуть блок">
</div>
<!-- </block9> -->
Очень важно соблюдать
имена идентификаторов , если этого не будет то будет беспорядочно открываться и закрываться блоки групповым способом.
автор: mdbaner
сайт автора: www.ucozon.ru
Внимание: при копирование материала ссылка на сайт автора клик-кабельная обязательна http://ucozon.ru , в противном случае на ваш сайт будет подана жалоба по статье:
2.3. При цитировании материалов Сайта, включая охраняемые авторские произведения, ссылка на Сайт обязательна (подпункт 1 пункта 1 статьи 1274 Г.К РФ).
Меню сайта
Меню сайта
Как сделать чтоб плавно сворачивался???)
