Cara membuat tombol show/hide di postingan blog

Cara membuat tombol show/hide di postingan blog, Ya itulah postingan saya kali ini. Apakah sobat pernah melihat tombol seperti di bawah ini ?
Klik show untuk melihat
MASUKAN TULISAN SOBAT DI SINI

Itulah yang dinamakan dengan tombol show/hide, kenapa bisa di sebut tombol show/hide ??
Ya karna apabila di klik tombolnya bisa show (muncul) dan bisa juga hide (sembunyi) hehehe.....
Sobat tertarik ? Yups kita ikuti langkah-langkahnya.
1. Yang pertama sobat harus login terlebih dahulu ke akun blogger sobat.
2. Kedua sobat tinggal copy dan pestekan kode berikut di dalam postingan sobat.
    Note : Di bagian HTML ya sob jangan di Compose.

<div><div style="margin-bottom: 2px;"><b><small>Klik show untuk melihat</small></b>
<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;">
MASUKAN TULISAN SOBAT DI SINI
</div></div></div>

Ganti tulisan MASUKAN TULISAN SOBAT DISINI dengan kata-kata yang sobat inginkan.
Jika sobat ingin memasukan gambar, tinggal masukan saja URL gambar yang ingin sobat masukan..
Ping your blog, website, or RSS feed for Free

Popular posts from this blog

Upgrade processor laptop? Cek dulu disini

Download Aplikasi LINE Untuk Pc (Windows 8, Windows 7, Windows Xp)

Download SHAREit untuk pc (windows xp, vista, 7, 8, 10) terbaru