Selasa, 27 Maret 2012

Cara Buat Spoiler | Tombol Hide and Show




Kalau kita lihat dari namanya, Hide and Show, kita pasti tau apa maksudnya? Hide and show artinya "Sembunyikan dan tunjukkan". Tombol ini biasanya di sebut juga spoiler. Spoiler di gunakan untuk meminimalisir Isi, gambar atau Postingan. Masih belum jelas? Begini... Misalkan sobat blogger mau bikin Postingan tentang "Cara Membuat Google Translate dengan Icon Bendera". Nah...Kita kan tau bahwa kode untuk bikin Google Translate ini sangat panjang, Kalau kita langsung tunjukkan kodenya di postingan kita, maka postingan kita terlihat kurang bagus. Solusinya apa dong? Inilah solusinya… Gunakan Spoiler ini.

Copy  kode di bawah ini dan tempatkan di tempat yang sobat inginkan...


<div><div style="margin-bottom: 2px;"><i><b><small>JUDUL SPOILER</small></b></i><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;">


ISI NYA (Terserah sobat Blogger)

</div></div></div> Cara Buat Spoiler dapat menambah pengetahuan sobat 
blogger.

0 komentar:

Posting Komentar

Template by:

Free Blog Templates