Klik show untuk melihat
Pada tutorial saya kali ini, saya akan memberikan petujuk. bagaimana cara membuat tombol show seperti diatas, pada tampilan posting saya diatas..
apakah anda tertarik? untuk membuatnya ?coba anda klik pada tombol show tersebut!!!
Oke, kita langsung aja pada cara pengerjaannya..
1. Yang perlu di pahami, bahwa untuk menghasilkan postingan seperti diatas, hendaknya untuk membuat suatu postingan, jangan menggunakan compose, melainkan menggunakan html.
 |
| gambar cara awal jika hendak posting pada blok dengan menggunakan html. |
maka masukan kode berikut ini, didalam postingan ( ingat postingannya harus yang pakai html, janagn compuse.
kodenya......
<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;">
Masukkan tulisanmu di sini
</div></div></div>
Keterangan :
- Warna biru merupakan petunjuk untuk tulisan "klik show untuk melihat" ini bisa anda ganti dengan apa yang anda inginkan.
- warna gold, itu adalah tulisan yang akan anda masukan pada bagian show, sehingga pada saat di klik, muncul tulisan tersebut.