Спойлер

Спойлер

Открывающиеся и закрывающийся div при нажатии на кнопку СПОЙЛЕР.
Закрыть тег, Кнопка html, Кнопка html на сайт, кнопки html, кнопку html,
код кнопки, открыть тег, html, html программирование. Кнопка с рисунком.
Кнопка html на сайт, код кнопки. Пояснение к коду кнопки html.
Кнопка с текстом. Кнопка с рисунком. Пояснение к коду кнопки html.
Кнопка с текстом. Спойлер, Код спойлера, спойлеры, со спойлером,
установить спойлер, вставить спойлер, вставить спойлер на сайт.
Кнопка с рисунком. Пояснение к коду кнопки html. Кнопка с текстом. 

Как сделать спойлер или появление блока при нажатии




<b class="spoiler-title">Показать/скрыть</b>

<div class="spoiler-body">Скрытый текст, который появится при наведении</div>

<script type="text/javascript">

$(document).ready(function(){

$('.spoiler-body').hide();

$('.spoiler-title').click(function(){

    $(this).toggleClass('opened').toggleClass('closed').next().slideToggle();

    if($(this).hasClass('opened')) {

        $(this).html('Скрыть текст');

    }

    else {

        $(this).html('Показать текст');

    }

});

});

</script>




Для корректной работы спойлера необходимо в строке "Скрытый текст,
который появится при наведении"

указать текст с первой или второй строки $(this)
- Скрыть текст или Показать текст.

Тогда в следующей строке получится

<div class="spoiler-body">Скрытый текст</div>

или

<div class="spoiler-body">Показать текст</div>

Соответственно при отображении кнопки на сайте, нажимая на кнопку текст будет меняться,
в приоритете будет стоять текст расположенный в div.

Спойлер. Открывающиеся и закрывающийся div (див) при нажатии на кнопку (СПОЙЛЕР).Как сделать спойлер или появление блока при нажатии. Соответственно при отображении кнопки на сайте, нажимая на кнопку текст будет меняться, в приоритете будет стоять текст расположенный в div. Открывающиеся и закрывающийся div, Показать / скрыть, Показать/скрыть, ри нажатии на кнопку, Спойлер, div.