JavaScript код ставим в нижнюю часть сайта
Код
<script type="text/javascript">
function open_close(id_spol) {
var obj = "";
if (document.getElementById) obj = document.getElementById(id_spol).style;
else if (document.all) obj = document.all[id_spol];
else if (document.layers) obj = document.layers[id_spol];
else return 1;
if (obj.display == "") obj.display = "none";
else if (obj.display != "none") obj.display = "none";
else obj.display = "block";
}
</script>
Далее, в том месте Вашей странички, где Вы планируете использовать спойлер, необходимо добавить следующий код:
Код
<div class="spoiler_style" onClick="open_close('spoiler1')">Название спойлера</div>
<div id="spoiler1" style="display:none;">
Здесь содержится все то, что должен скрывать спойлер.
Под спойлером может содержаться не только текст, но и картинки,
таблицы и другие элементы. например изображение.
<img src="ссылка" alt="Изображение под спойлером" width="250">
</div>
Данный код мы ставим в стили css в самый низ:
Код
.spoiler_style {cursor:pointer;}
Вот и все. В результате у Вас должен получиться простой спойлер, который поможет Вам сэкономить немало места на сайте.
P.S.
Часто спрашивают, как можно за мудрить на одной странице сразу два спойлера или больше?
Объяснения просты:
Просто в функции для открытия второго спойлера необходимо заменить onClick="open_close('spoiler1')" на onClick="open_close('spoiler2')".
Так же второму спойлеру необходимо дать новое имя - id="spoiler2"
Если кто сделал что-то не так как я пояснил, то я не виноват...