простые спойлера или раскрытие скрытых блоков
в данной теме я буду размещать простые сборки, которые реализуют функцию спойлера (открытие/закрытие скрытого блока) при разных факторах воздействия, таких, как при наведении, по клику...
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
а вот здесь что-то спрятанo
делается это очень просто:
в процессе. тема будет постоянно пополняться. как увижу в сети чего новенького - запишу.