Как сделать простой спойлер

Иногда требуется не показывать полностью какой-то фрагмент текста, поместив его в спойлер – область, которая сворачивается/разворачивается по клику на ключевом слове. Для чего это нужно? Ну, например, чтобы опубликовать текст, который не должен сразу бросаться в глаза, а должен лишь появляться по желанию читателя.
Для того, чтобы в блоге заработал спойлер, можно воспользоваться специальным плагином. А можно и обойтись без плагинов, самостоятельно создав спойлер с помощью java-скриптов. Давайте создадим такой спойлер без посторонней помощи.

Воспользуемся для этого библиотекой jQuery, подключив ее к блогу. Откройте файл header.php и вставьте эти строчки кода до [code inline=”yes”]:

$(document).ready(function(){$('.splLink').click(function(){$(this).parent().children('div.splCont').toggle('normal');return false;});});

Первой строчкой мы подключаем библиотеку jQuery, а остальные строчки как раз нужны для того, чтобы спойлер работал. Теперь нам осталось вставить сам код спойлера в любое место темы:

<div><a href="//" class="splLink">Спойлер</a>
  <div>содержимое спойлера</div>
</div>

• Спойлер – это текст ссылки, кликнув по которой, вы откроете содержимое спойлера. Следующий клик спрячет его обратно.
• Cодержимое спойлера – тут может располагаться все, что угодно: ссылки, картинки. DIV, в который заключено содержимое спойлера, можно украсить с помощью CSS, прописав ему класс.

Пользуйтесь!