Cara Membuat Tombol Hide/Show

Kali ini saya akan menerangkan bagaimana cara membuat tombol Hide/Show atau yang biasa disebut tombol Spoiler . Sebelum saya menjelaskan cara pembuatan nya silahkan sobat lihat dulu contoh tombol Hide/Show .

Contoh Tombol Hide/Show

alt="" src="data:image/png;base64,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" />

Sobat tertarik untuk membuatnya ? Jika Ya silahkan ikuti langkah - langkah dibawah ini :

1. Sing in akun blogger
2. Klik Rancangan => Tambah Gadget => Pilih HTML/Javascript
3. Masukkan kode dibawah ini

<div><div style="margin: 5px;">
<div style="margin-bottom: 2px;" class="bigfont"><input style="margin: 0px; padding: 0px; width: 95px; " value="Show" 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: 0px inset ; margin: 0px; padding: 6px;" class="alt2">
<div style="display: none;">

Silahkan kalian isi dengan apa yang perlu kalian singkat.

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

Keterangan :
   => Warna Merah sobat bisa ganti sesuai dengan keinginan sobat
   => Warna Biru sobat ganti dengan apa yang sobat perlu singkatkan

4. Simpan