Membuat Tombol "SHOW HIDE" pada HTML Bloger/Wordpress/Website

Mari belajar lagi untuk mengetahui apa yang selama ini yang belum kita ketahui,
berikut ini kita belajar mengenai cara membuat Tombol "Show Hide" pada HTML.

Tips untuk bloger:

Masukklah ke Blog Sobat
Pilih "New Entri"
Pilih HTML dan masukan Kode di bawah ini

<div dir="ltr" style="text-align: left;" trbidi="on"> <div> <input 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 = 'Sembunyikan'; } else{ this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Tampilkan'; }" style="font-size: 10px; margin: 0px; padding: 0px; width: auto;" type="button" value="Tampilkan" /></div> <div class="alt2"> <div style="display: none;"> <div style="background: #000000; color: white; padding: 10px; text-align: left;"> Masukkan text-nya disini. Gambar juga bisa... </div> </div> </div> </div>
Simpan/Publikasikan-Lihat hasilnya.
Selesai

Note: Ganti kalimat "Tampilkan" dan "Masukkan text-nya disini. Gambar juga bisa..." sesuai keinginan anda.

Contoh:

Ilmu Pengetahuan

Membuat Tombol "SHOW HIDE" pada HTML Bloger/Wordpress/Website

Unknown

1 komentar:

Populer Post

Sponsor Vip1

ILMU PENGETAHUAN Label