Cara membuat tombol spoiler

Postingan saya kali ini akan membahas tentang cara membuat tombol spoiler (show/hide) di postingan... Yaps yang seperti tombol di posting saya Download AVG. Sebenarnya sih saya juga sudah mengetahuinya dari dulu.. hehe :P. Okay begini caranya :

1.     Buat sebuah postingan (atau pilih salah satu postingan anda).

2.    Edit Posting tersebut.

3.    Pilih HTML editing.

4.    Di paling atas silahkan anda copy-paste(copas) code berikut :

<div>

<input value="Show posting" style="margin: 0px; padding:0px;width:auto;font-size:10px;" onclick="if(this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display != &#39;&#39;) { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;&#39;; this.innerText = &#39;&#39;; this.value = &#39;Hide posting&#39;; } else{ this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;none&#39;; this.innerText = &#39;&#39;; this.value = &#39;Tampilkan&#39;; }" type="button" /></div>

<div class="alt2">

<div style="display: none;">

<div style="background:#ffffff;text-align:left;padding:10px;color:#000000;">

Dan di akhir html postingan tambahkan code :

</div>

</div>

</div>

Contoh, jika anda memiliki postingan dengan format HTML codenya :

<br />

<div class="MsoNormal">

<span style="font-family: 'Comic Sans MS';">Sebenarnya cara

ini mungkin sudah dikenal oleh agan-agan yang sering ngeblogwalking yah,, tapi

tak apalah saya akan membahasnya.. Cara singkatnya saja yaa... hehe :</span></div>

<!--more--><o:p></o:p><br />

Maka akan menjadi seperti ini jika telah ditambah code tombolnya:

<input value="Show posting" style="margin: 0px; padding:0px;width:auto;font-size:10px;" onclick="if(this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display != &#39;&#39;) { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;&#39;; this.innerText = &#39;&#39;; this.value = &#39;Hide posting&#39;; } else{ this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;none&#39;; this.innerText = &#39;&#39;; this.value = &#39;Tampilkan&#39;; }" type="button" /></div>

<div class="alt2">

<div style="display: none;">

<div style="background:#ffffff;text-align:left;padding:10px;color:#000000;">

<br />

<div class="MsoNormal">

<span style="font-family: 'Comic Sans MS';">Sebenarnya cara

ini mungkin sudah dikenal oleh agan-agan yang sering ngeblogwalking yah,, tapi

tak apalah saya akan membahasnya.. Cara singkatnya saja yaa... hehe :</span></div>

<!--more--><o:p></o:p><br />

</div>

</div>

</div>

5.    Nah selesai,,, jika berhasil akan seperti posting ini.. J