Cara Membuat Spoiler Show atau Hide

cara membuat spoiler show atau hide

Spoiler ini berfungsi untuk Menyembunyikan media seperti Teks, Gambar, Video atau apa saja di blog atau website dan media tersebut akan muncul jika di Klik tombol Show/Hide atau Buka/Tutup, Apa tujuan media tersebut disembunyikan? tujuannya yaitu untuk mempercepat loading web atau blog kita.

Sekarang, Bagaimana cara membuat Spoiler Show atau Hide? Silahkan ikuti cara di bawah ini:


Contoh Spoiler:


Kodenya Seperti ini:

<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 = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" style="font-size: 12px; margin: 0px; padding: 0px; width: 55px;" type="button" value="Buka" />
</div>
<div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px;">
<div style="display: none;">
<div align="center">
<iframe allowfullscreen="" frameborder="0" height="315" src="//www.youtube.com/embed/p3qqrCrbAqk" width="540"></iframe></div>

</div>
</div>
</div>

Tulisan berwarna merah adalah kode dari isi Spoiler tersebut, dan Tulisan Warna Biru silahkan anda Ganti dengan kata sesuai keinginan anda, Misal show/hide atau Buka/tutup :)

Sekian Artikel Cara Membuat Spoiler Show atau Hide

Postingan terkait:

1 Tanggapan untuk "Cara Membuat Spoiler Show atau Hide"

  1. Your style is so unique compared to other folks I've read stuff from. Thanks for posting when you've got the opportunity, Guess I will just bookmark this site. all of craigslist

    BalasHapus