1 ответ
В приведённом примере триггером того, что блок необходимо показать является <input type="checkbox">
он скрыт, чтобы не влиять на вёрстку и размещается рядом с любым блоком. Переключение происходит благодаря тегу label
, который можно разместить где угодно на странице.
.two {
display: none
}
input#trigger {
display: none;
}
input#trigger:checked+div {
display: block;
}
label {
box-shadow: 0 0 1px 0;
}
<label for="trigger">Кнопка</label>
<div>
<div class="one">1</div>
<input id="trigger" type="checkbox">
<div class="two">2</div>
<div class="three">3</div>
</div>