Cara Membuat Tombol Show/hide atau Spoiler di postingan blog

 
Assalamualaikum sobat semuanya !!!
Membuat Tombol Show/hide atau dikenal dengan nama Spoiler, itulah posting yang akan kita bahas dan pelajari bersama-sama kali ini. saat menulis sebuah posting, adakalanya kita memerlukan tombol Spoiler, untuk menyembunyikan sesuatu, misalnya gambar,tulisan,dll. caranya sangat mudah kok sob....Ok sob, tanpa panjang lebar,, yuk kita pelajari caranya...

Copy code berikut:::

<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>

Setelah sobat copy, sobat tinggal masukan ke posting sobat.''ingat ya sob,, masukannya di HTML'' jangan di compose. KETERANGAN: Kalimat MASUKAN TULISAN SOBAT DI SINI, diganti dengan tulisan yang sobat inginkan, atau kalo sobat mau masukan gambar, sobat ganti dengan Url gambar sobat. Bagaimana sob mudahkan ! kalo sobat mengikuti dengan benar maka hasilnya akan seperti ini :

Klik show untuk melihat

http://jakashare.blogspot.com

Semoga bermanfaat dan jangan lupa komentarnya ya..

Posted in: Tutorial Bloger