Lalu seperti apa tombol yang dimaksud pada judul di atas? Yang pasti dengan tombol ini anda bisa menghemat tempat pada halaman posting.
Daripada ngalor-ngidul nggak jelas, langsung ke cara dan contoh saja.
Gunakan kode ini untuk membuatnya:
<div><div style="margin: 5px;"><div class="smallfont" style="margin-bottom: 2px;"><input value="Tampilkan" style="margin: 0px; padding: 0px; width: auto; 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 = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Tampilkan'; }" type="button"/></div><div class="alt2"><div style="display: none;"><div style="border: 1px dotted #006400; text-align: justify;">isi teks atau kode gambar yang disembunyikan dibalik tombol</div></div></div></div></div>
Nah, hasilnya akan menjadi seperti tombol di bawah ini (silahkan di klik)
Perhatikan pada kode yang saya beri warna biru dan kuning, tulisan-tulisan tersebut dapat anda ganti sesuai keinginan. Dan pada teks yang berwarna hijau, anda isi dengan tulisan atau gambar yang ingin anda sembunyikan dan akan tampil setelah tombol di-klik. O iya, anda juga dapat bereksperimen dengan mengutak-atik tag style-nya.
Maaf, bagi para pengguna ponsel anda bisa baca cara copy-paste artikel blog dengan HP DISINI untuk meng-copy script di atas.
Sekian, moga berguna.
Sumber : http://www.bi2t.com/
Ini yang lagi aku cari. Makasih atas tutorialnya bro :)
BalasHapusWuii..iiihh , artikel yang menarik...!!! Sukses selalu sob...
BalasHapusTo masluhur.com & Regina Karya Invitation card : thanks atas kunjungannya. Thanks juga atas komentarnya. Apabila ada yang kurang dari artikel ini, mohon kritik dan sarannya.
BalasHapusthanks all....
Makasih Infonya...
BalasHapusmau tanya Bung... Postingan atau Tulisannya yang tidak disembunyikan ditaruh sebelah mana ??
to Mufty : maaf ya klw pertanyaannya bru dibalas..
BalasHapusuntuk postingan maupun tulisan yang tidak disembunyikan bisa kamu taruh di luar kode HTML di atas. Sebelumnya kamu ketik postingan tsb menggunakan TEKS biasa. Nanti saat memposting untuk tulisan yang ingin kamu sembunyikan, kamu masuk pada HTML, copas kode HTML di atas trus kamu ketik tulisan/postingan yang ingin kamu sembunyikan pada tulisan "isi teks atau kode gambar yang disembunyikan dibalik tombol"
semoga bisa membantu ya gan...