Membuat Text Area Dengan Spoiler Show Hidden

Lama nih udah ga pernah posting. Berhubung ada sobat Pakirwan yang butuh bantuan untuk membuat text area dengan spoiler Show Hidden maka jadi ada lagi deh kesempatan untuk posting lagi. Kadang emang dibutuhkan Spoiler Show Hidden ini ketika sobat merasa kalau postingan sobat terlalu panjang. Jadi mungkin ada baiknya hal-hal tertentu untuk di Spoiler Show Hidden supaya postingan sobat tidak terlihat terlalu panjang.

Oke deh tanpa berlama-lama disini Pakirwan akan berbagi script bagaimana untuk menjadikan Text area tertentu menjadi Spoiler Show Hidden. Berikut ini scriptnya :

<div>
<div style="margin-bottom: 5px;">
<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: 12px; margin: 0px; padding: 0px; width: 80px;" type="button" value="Show" /></div>
<div style="border: 1px inset; margin: 0px; padding: 6px;">
<div style="display: none;">
LETAKKAN TEXT YANG AKAN DI SPOILER SHOW HIDDEN DISINI</div>
</div>
</div>

Hasilnya akan seperti berikut ini.

Semoga tutorial ini bermanfaat bagi seluruh sobat Pakirwan dan jangan lupa selalu biasakan tinggalkan comment nya untuk kemajuan dan motivasinya bagi perkembangan blog ini... :)