сайт на данный момент является архивом информации по форуму phpbb 3.0. объяснения и помощь больше не предоставляются. старый сайт

Белк на PhpBB 3.0.14

информация по этому форуму. bbcode, моды и прочее, проверенное Белком. (перенос данных продолжается...)

Сегодня на конференции было 3 посетителей :: 0 зарегистрированных, 0 скрытых, 0 ботов и 3 гостей (основано на активности посетителей за последние 24 часа)

Страница 1 из 1

[ 1 сообщение ]

простые спойлера или раскрытие скрытых блоков

Версия для печати

Пред. тема | След. тема

Автор Сообщение

Belk (Андрей)

11 янв 2026, 10:04 простые спойлера или раскрытие скрытых блоков

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

Стаж: 5 месяцев 22 дня
Сообщения: 228
Откуда: здешние мы

Стиль сайта: subsilver2
Настоящее имя: Андрей

простые спойлера или раскрытие скрытых блоков

в данной теме я буду размещать простые сборки, которые реализуют функцию спойлера (открытие/закрытие скрытого блока) при разных факторах воздействия, таких, как при наведении, по клику...

Открытие блоков по клику

1.простой спойлер

пример:

нажмите сюда!

сделано это просто:

Код: Выделить всё

<div>
   <div style="font-size: 0.9em; font-weight: bold; cursor: pointer" onclick="hidn = this.parentNode.getElementsByTagName('div')[1]; btn = this.getElementsByTagName('img')[0]; if (hidn.style.display != '') { hidn.style.display = ''; orimg = btn.src; btn.src = 'data:image/gif;base64,R0lGODlhCQAJAMQeAOLt+ff8//z+/4CRxo2by7vF6a254X6PxICQw87a74CQxuXo84CQxM/b7/H6/v7+/oGRxouayoGSxv7+/8LN7IqZyv7//4KSxur0/MrV74OTx9Ld8trl9gwMDP///wAAACH5BAEAAB4ALAAAAAAJAAkAAAU4oFcpwzFAkWgUVLZxCQGxLgdgGtS+t6NJmY5QOEFcNo/kZGLRXGwYR0DQjDSiU8uCIJJIGJdLKgQAOw=='; } else { hidn.style.display = 'none'; btn.src = orimg; }">
      <img style="margin: 0; padding: 5px 5px 0" src="data:image/gif;base64,R0lGODlhCQAJAMQfAIqZyoGSxv3+/trl84CQxYCRxn6PxMXQ7efq9H+Pwtnk8oKTxoCQxKy44QAAANvl9rvG6fD5/o2by4GRxvb8//v9//7+/ubw+v39/ouayoKSxoOTx/7+/wwMDP///////yH5BAEAAB8ALAAAAAAJAAkAAAU84AdoGkNmX4Z4HldRirSxXMdF1zK7nXU9mk2t4+h0BIlNhWPpYTCBDQXXwRwggczgJ8BAGhLRZGIoEFAhADs=" />
      <u>нажмите сюда!</u>
   </div>
   <div style="display: none;">
      здесь что-то спрятано
   </div>
</div>

ссылку на автора написать не могу, так как нашёл его в сети очень давно и не помню уже где...

Открытие блоков при наведении

1. Простое открытие при наведении на CSS

пример:

наведите на меня!
а вот здесь что-то спрятанo

делается это очень просто:

html-код

Код: Выделить всё

<div id="picTxt">
наведите на меня
<br>
<span>а вот здесь что-то спрятано</span>
</div>

css

Код: Выделить всё

#picTxt {cursor: default;}
#picTxt span {display:none;}
#picTxt:hover span {display:block;}

в процессе. тема будет постоянно пополняться. как увижу в сети чего новенького - запишу.

трёхголовый белк семейства рептилоидов:
"три головы - хорошо, на как же трудно придти к согласию..."

Цитата

Страница 1 из 1

[ 1 сообщение ]

Кто сейчас на конференции:

Всего посетителей: 1, из них зарегистрированных: 0, скрытых: 0 и гостей: 1 (основано на активности пользователей за последние 5 минут)
Больше всего посетителей (63) здесь было 23 май 2026, 12:35

Сейчас этот форум просматривают: нет зарегистрированных пользователей и гости: 1

Список форумов » Сайтостроение » Разное

Часовой пояс: UTC + 3 часа

Вы не можете начинать темы
Вы не можете отвечать на сообщения
Вы не можете редактировать свои сообщения
Вы не можете удалять свои сообщения
Вы не можете добавлять вложения

Текущее время: 29 июн 2026, 04:26