Cara Membuat Tombol Spoiler

Cara Membuat Tombol Spoiler

Temen blogger ada yang belum tau cara membuat tombol spoiler atau tombol hide show, oke pembelajaran ghostcell kali ini tentang cara membuat tombol spoiler kayak yang ada di forum-forum. Lihat penampakannya:

link Download :  

***Hidden Content***
Please follow to see hidden content. Thanks

Berikut caranya:
1. Pada Tab Rancangan, Elemen Halaman
2. Pilih Add Gagdet, HTML/JavaScrip
3. Copy Paste kode berikut:

<div><div style="margin-bottom: 2px;"><i><b><small>JUDUL SPOILER</small></b></i><input value="Show" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" 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'; }" type="button"></div>
<div style="border: 1px inset ; margin: 0px; padding: 6px;"><div style="display: none;">

***Hidden Content***
Please follow to see hidden content

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

4. Simpan

Selamat Eksperimen.

Posted in: Blog