Membuat Tombol Show Hide Gambar - Text di Blog (spoiler)

30 Sep 2010 - - 25

Tombol Show Hide pada Blog (spoiler) ini berfungsi untuk menyembunyikan gambar atau text yang terlalu panjang sehingga bisa menghemat tempat posting. bisa juga digunakan untuk menyembunyikan gambar unik atau gambar yang mengejutkan pembaca.contohnya lihat di posting disini.

Untuk cara-caranya silahkan ikuti tutorial berikut:

1. Login kehalaman admin blog anda
2. CoPas code yang ada dibawah ini kedalam posting atau sidebar anda.
3. selesai.
   

Berikut Codenya:

<div style="text-align: center;"><div class="button-spoiler"><input value="Contoh Tombol Spoiler" 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 = 'Sembuntikan'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Tampak'; }" type="button"></div><div class="spoiler"><div style="display: none;"><br /><br /> <div style="text-align: left; padding: 10px; border: 3px inset #333; font-size: small;"><br /><br /><br /><br />Silahkan tulis text atau gambar disini <br /><br /><br /><br /><br /><br /> </div></div></div></div>

Penjelasan Code:

Yang saya blok silahkan anda isi dengan teks atau kode gambar yang ingin anda sembunyikan.

kalau di Kaskus untuk membuat spoiler caranya menggunakan kode berikut:

[spoiler=pesan]isi pesan[/spoiler]

Selamat mencoba, semoga bermanfaat.