Cara Membuat Spoiler

Bookmark and Share
Terkadang kita itu membuat teks yang terlalu panjang. Atau kita membuat sesuatu kata yang berisi link Tautan. Nah, untuk menyembunyikan kata itu dan orang yang ingin melihat kata yang disembunyikan itu harus mengklik tombol yang telah disediakan. Ini disebut dengan Spoiler. Sekarang kita akan membahas tentang bagaimana cara membuat spoiler. Spoiler juga banyak dipakai para blogger karena dapat  mengurangi pemborosan halaman. Tanpa basa basi mari kita langsung To The Point aja.



Contoh Spoiler yang akan saya buat adalah:
Spoiler:
Tulis Teks Anda Disini



Untuk membuat spoiler, anda tinggal copy code di bawah ini


<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;"><b>Spoiler</b>: <input value="Open" style="margin: 0px; padding: 0px; width: 55px; font-size: 11px;" 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 = 'Close'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Open'; }" type="button">
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">

Tulis Teks Anda Disini

<br>
</div>
</div>
</div>
  1. Untuk tulisan Open dan Close anda bisa mengganti sesuai keinginan anda.
  2. Width : 55px untuk lebar spoiler.
  3. Font-size: 11px untuk besar tulisan pada kotak spoiler.
  4. Tulisan Spoiler adalah judul, silahkan ganti sesuai keinginan sobat.

{ 0 komentar... Views All / Send Comment! }

Posting Komentar

Powered By Blogger