Membuat Show Hide Seperti Di Kaskus

bingung mau posting apa soalnya udah lama gak update blog...
dari pada nanti ngelantur dan panjang lebar nggak jelas arahnya kemana mendingan berbagi sedikit bagaimana cara membuat spoiler show hide seperti yang sering kita jumpai dikaskus.

Fungsinya show hide hanya untuk memperindah tampilan posting dan kita dapat mengisi dengan tulisan ataupun gambar didalam spoiler show hide, dan bisa juga agar tampilan postingan blog tidak terlihat terlalu banyak.

berikut cara memasangnya agar bisa tampil di posting, masukan script html dibawah ini diposting lalu masukan tulisan atau gambar di isi dengan tulisan atau gambar

Spoiler for title :

<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;">
<b>Spoiler</b> for <i>title</i> : <input onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" style="font-size: 11px; margin: 0px; padding: 0px; width: 75px;" type="button" value="Show" /></div>
<div class="alt2" style="-moz-background-clip: border; -moz-background-inline-policy: continuous; -moz-background-origin: padding; background: rgb(225, 228, 242) none repeat scroll 0% 0%; border: 1px inset; margin: 0px; padding: 6px;">
<div style="display: none;">

isi dengan tulisan atau gambar

</div>
</div>
</div>

selamat mencoba....