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

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 beri warna hijau 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.

Posting Komentar

thanks kawand ada HTML nya,. ^_^

jalan-jalan ke Blog ku kawand hehee
http://bontangkreatif.blogspot.com/

MANTAPZ GAN NICE POST !!!
KUJUNGI http://www.duniapascalle.blogspot.com

Wah mantab gan artikelnya......

visit my blog donk....
http://www.artikelkomputer.net/

Wah mantab gan artikelnya......

visit my blog donk....
http://www.artikelkomputer.net/

... thanks artikel yg bermanfaat sekali !

templatenya pikirku facebook :D mantap templatenya

makasih dah bagi2 ilmunya, ringan dan jelas

@All: makasih kunjunganya, semoga bermanfaat.

lum mudeng cara masukin kode gambar,,..

yang kurang jelas mengenai memasukan kode gambar, bisa baca posting ini:
http://www.mrmung.com/2010/12/cara-mendapat-hosting-gambar-gratis.html

Trimakasih sangat mas broo, tutorial ini sangat mempesonakan diriku, izin sedot..!!

Visit: www.frangkyblog.blogspot.com

tapi bro kalo pngen bikin di artikel posting gimana yaakunujngin dong http://baguzzzen.blogspot.com/

Nice info, perlu dicoba juga nih tipsnya.

izin nyoba gan..buat hiding banner partner saya...dh tll bnyk..mksh infonya ya

sipp tutornya.. mampir kak
http://pakarilmu.web.id
PAKAR ILMU

Mantap bos...
udah ak pake..
please visit my blog...
http://blackroom13.blogspot.com

Bermanfaat bro
show hide dipasang
:D

[facebook][blogger]

MKRdezign

Formulir Kontak

Nama

Email *

Pesan *

Javascript DisablePlease Enable Javascript To See All Widget

Label