Warung Bebas

Minggu, 26 Desember 2010

Membuat Tombol Hide & Show (spoiler)


gambar, cara membuat tombol hidden show, tampilkan  sembunyikan Mungkin anda ingin menyembunyikan sebagian artikel dengan tombol hide show...? Agar artikel terlihat tidak terlalu banyak anda bisa gunakan script spoiler mau tau caranya mari kita belajar bersama...
<div> <input value="Tampilkan" style="margin: 0px; padding:0px;width:auto;font-size:10px;" onclick="if(this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display != &#39;&#39;) { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;&#39;; this.innerText = &#39;&#39;; this.value = &#39;Sembunyikan&#39;; } else{ this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;none&#39;; this.innerText = &#39;&#39;; this.value = &#39;Tampilkan&#39;; }" type="button" /></div> <div class="alt2"> <div style="display: none;"> <div style="background:#000000;text-align:left;padding:10px;color:#ffffff;"> Masukkan text-nya disini. Gambar juga bisa. </div> </div> </div>
Hasilnnya seperti di bawah ini
Perhatikan text yang saya cetak berwarna merah dan biru, anda dapat mengubah / mengedit text yang saya cetak berwarna merah dan biru selamat mencoba.


Semoga bermanfaat. Ingat ya, perhatikan yang berwarna merah dan biru kalau ingin mengedit-nya sekali lagi semoga bermanfaat.

0 komentar em “Membuat Tombol Hide & Show (spoiler)”

Poskan Komentar

 

Download Serba Gratis Copyright © 2012 Fast Loading -- Powered by Blogger