Profil Saya

Foto saya
Hanya seorang Blogger yang ingin membuat blog dengan konten yang "Berkualitas".

Sabtu, 22 Maret 2014

Cara Membuat kolom "Klik Show Untuk Melihat"

Penasaran dengan cara membuat kolom seperti ini:

Klik Show Untuk melihat
Jawaban....

Caranya Gampang kok...

1. Buka Kolom HTML (Disamping kolom Compose)


2. Copy Kode ini lalu paste pada kolom HTML sesuaikan dengan letak yang diinginkan.

<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;">
Jawaban....
</div></div></div>

Tulisan warna biru disesuaikan dengan kata-kata yang diinginkan, seperti:
*Tekan untuk mengetahui jawaban
*Caranya adalah
*dll

 Tulisan warna merah disesuaikan dengan kalimat yang ingin ditampilkan jika meng-klik "Show".

3. Kembali ke Kolom Compose dan lihat hasilnya

Sederhana Bukan?? Salam Blogger :)

Tidak ada komentar:

Posting Komentar

PERHATIAN

Berkomentarlah Dengan Bijak, Dalam Komentar, tidak boleh ada Unsur:

*Penghinaan/Pelecehan/dll
*Spam Comment
*kata2 tidak pantas

Jika Kami Menemukan Komentar Yang Mengandung Unsur Diatas, Maka Secara Otomatis Kami akan Menghapus komentar tersebut.

Related Posts Plugin for WordPress, Blogger...