Код:
<style type="text/css">
.spoiler {
background-color : #edf5fd;
background-image : url(http://grayangel.ucoz.ru/design/spoiler_bg.gif);
background-repeat: repeat-x;
border : thin ridge #F0F0F0;
padding-left : 40px;
padding-right : 20px;
margin-left : 20px;
margin-right : 40px;
}
.spoilerheader {
padding-left : 15px;
background-image : url(http://grayangel.ucoz.ru/design/plus.gif);
background-repeat: no-repeat;
background-position:0 1;
display:block;
cursor: pointer;
}
.spoiler.open .spoilerheader {background-image : url(http://grayangel.ucoz.ru/design/minus.gif);}
.spoiler .spoilertext {display:none;}
.spoiler.open .spoilertext {display:block;}
</style>
<script language="javascript">
function spoiler_on()
{
//document.getElementById('spoiler').style.visibility='visible';
document.getElementById('spoiler').style.display='';
}
function spoiler_off()
{
//document.getElementById('spoiler').style.visibility='hidden';
document.getElementById('spoiler').style.display='none';
}
</script>
<div class="spoiler">
<a class="spoilerheader" onclick="this.parentNode.className=this.parentNode.className=='spoiler'?'spoiler open':'spoiler'">
<b>Отображаемый текст спойлера</b>
</a>
<div class="spoilertext">
Скрытый в спойлере текст.<br>
Можно разместить <b>что угодно</b>, хоть таблицу, хоть ролик YouTube. Но закачиваться будет вместе со страницей.</div>
</div>
</div>