Спойлер только на CSS с кнопкой в другом Div

silmarion

Полезный
Регистрация
21 Июн 2012
Сообщения
194
Реакции
19
Доброго всем времени суток, очень нужно сделать CSS спойлер, нашел много всего, но не подходит только по одной причине, нужно чтобы спойлер был в 1 диве, а кнопка находилась совсем в другом месте.

Единственное что более-менее нашел
Код:
<style>   
.show,
.hide {border-bottom: 1px dashed;cursor: pointer;}
.hide,.content {  display: none;}
.spoiler_controler {  display: none;}
.spoiler_controler:checked + label .show {  display: none;}
.spoiler_controler:checked + label .hide {  display: inline;}
.spoiler_controler:checked ~ .content {  display: block;}
</style>
<div>
  <input id="inp" class="spoiler_controler" type="checkbox">
  <label for="inp">
  <span class="show">Показать</span>
  <span class="hide">Скрыть</span>
  </label>
  <div class="content">
  Варкалось. Хливкие шорьки<br>
  Пырялись по наве,<br>
  И хрюкотали зелюки,<br>
  Как мюмзики в мове.
  </div>
</div>

Но все равно не совсем то что нужно
 
Доброго всем времени суток, очень нужно сделать CSS спойлер, нашел много всего, но не подходит только по одной причине, нужно чтобы спойлер был в 1 диве, а кнопка находилась совсем в другом месте.

Единственное что более-менее нашел
Код:
<style>  
.show,
.hide {border-bottom: 1px dashed;cursor: pointer;}
.hide,.content {  display: none;}
.spoiler_controler {  display: none;}
.spoiler_controler:checked + label .show {  display: none;}
.spoiler_controler:checked + label .hide {  display: inline;}
.spoiler_controler:checked ~ .content {  display: block;}
</style>
<div>
  <input id="inp" class="spoiler_controler" type="checkbox">
  <label for="inp">
  <span class="show">Показать</span>
  <span class="hide">Скрыть</span>
  </label>
  <div class="content">
  Варкалось. Хливкие шорьки<br>
  Пырялись по наве,<br>
  И хрюкотали зелюки,<br>
  Как мюмзики в мове.
  </div>
</div>

Но все равно не совсем то что нужно
Лови:
1. Для просмотра ссылки Войди или Зарегистрируйся
2. Для просмотра ссылки Войди или Зарегистрируйся
 
Лови:
1. Для просмотра ссылки Войди или Зарегистрируйся
2. Для просмотра ссылки Войди или Зарегистрируйся

Я эти видел, это не совсем то, так то работает, но стоит кнопки вынести в соседний див и всё

Тем более оказывается мне еще нужно 2 кнопки для одного блока с содержимым
При нажатии на 1 - 1 контент, при нажатии на 2 - 2 контент

Может не спойлер, а подгрузка внешних данных в див по клику мне подойдет?
 
Назад
Сверху