УНИВЕРСАЛЬНАЯ КНОПКА СКРЫТИЯ,
- СКРЫВАЕМ ВСЁ!
(*Продолжаем демонстрировать возможности)
Скрываем категории, приветствие, объявление, статистику
Попробовать можно тут > Это интересно
Установка
В начало HTML верх (*Если у Вас еще не стоит этот код, - если стоит - этот пункт пропускаем
Пункт [1]
<!--Универсальная кнопка скрытия -->
<style class="Sbdcf5" id="Shoxa_01">.z-Hide{display:none!important;}</style>
<script src="//forumstatic.ru/files/0012/d8/04/98350.js"></script>
<!--//End /Универсальная кнопка скрытия Ч1 в HTML верх-->
В начало HTML низ
Пункт [2]
<!-- //=Универсальная Кнопка Ч2-HTML низ//Скрытие Категорий и т.д.-->
<div id="CNtButton" style="display:none;">
<span class="Show-Hide" alt="###">
<span class="b-Hide">
<img src="http://funkyimg.com/i/2bwKs.gif" title="Скрыть">
</span>
<span class="b-Show" style="display:none">
<img src="http://funkyimg.com/i/2bwKi.gif" title="Показать">
</span>
</span>
</div>
<script type="text/javascript">var DD=$("#CNtButton").html().split('###');
$("#pun-announcement .container, #pun-status .container, .category .container, #pun-stats .statscon").each(function(){var L=DD[0]+"#"+$(this).parent().attr("id")+" ."+$(this).attr("class")+DD[1];$(this).before(L);})
</script><!-- //End-/Универсальная Кнопка//Скрытие Категорий и т.д.-->
Стиль Кнопки
В HTML верх (или в Конец первого Окна Стиля без тегов <style>
Пункт [3]
<style>
.Show-Hide{
z-index:100;
position:absolute;
padding:0;
margin-left:775px;
margin-top:-23px;
}
.Show-Hide *{
padding:0;
margin:0;
border:none transparent 0!important;
}
.Show-Hide span img{
cursor:pointer;
width:auto;
}
.Show-Hide[alt="#pun-status .container"]{
margin-top: 0px;
}
</style>
Пояснения:
Для начинающего, эту часть можно не читать - просто установить код и Всё
По Пункту [2]
Красным - ссылки на картинки Cкрыть/Показать (*если нужно, меняем на свои
Синим - перечисление скрываемых селекторов, что не нужно - убираем из списка
(!!!Внимание - Последний элемент в Списке на конце без запятой!
*Для наглядности, - селекторы выделены подчёркиванием через один.
1. #pun-announcement .container, - Объявление
2. #pun-status .container, - Приветствие (Привет Гость...или Привет Гость
3. .category .container, - Категории
4. #pun-stats .statscon - Статистика
По Пункту [3] (см Стиль кнопок
1. Выравниваем - Ставим в нужное место все кнопки категорий!
a) Отступ от слево регулируем цифру в margin-left:775px;
(*если ширина форума задана в % ставим вместо 775px нужный % ->, к примеру -> 65%
Если Кнопки хотим ставить слево(а не справо), то уменьшаем цифру, к примеру, до 10-20px
a) Подвижка вверх: регулируем цифру в margin-top:-23px;
2. Выравниваем - Ставим(если есть необходимость) в нужное место остальные кнопки(не для скрытия категорий)
Для Этого в конец стиля Кнопок ставим такие коды селекторов (Под каждую кнопку, с желаемой дополнительной регулировкой
.Show-Hide[alt="#pun-status .container"]{
margin-top: 0px;
}
Где #pun-status .container - нужный селектор скрываемого контента кнопки (см. предыдущее пояснения). Значение 0px -отступ от верха - регулируем (может быть как плюс так и минус )
/*В общем случае, можно добавить в указания к селектору ещё и margin-left:XXpx; для подвижки кнопки влево-вправо/
Достоинства:
1. Независимость Установок скрытия для разных групп пользователей( т.е у Вас не будет такого, что скрытие
Скрытой от гостя категории в режиме Админа- Юзера-Пользователя приводит при Выходе-Входе(с форума) к скрытию какой-то иной категории, которую Вы не скрывали
2. Нет Ограничений для ИЕ6-7-8(а может и 9) по количеству кнопок
3. Более универсальное скрытие и возможность добавления новых кнопок, например для части контента в Объявлении, или Сайдбаре...(см. Пост 862 - 865
(*ЗЫ: - При использовании Переключателя стилей, стиль для кнопок, см. пункт [3]), добавляем к каждому стилю(с регулировкой, применительно к этому стилю) в конец первого Окна стиля
Отредактировано Deff (Вс, 16 Янв 2022 21:20:50)