Cara Membuat Spoiler - Indriawan dot Com | Informasi Dan Berita Online

Breaking

Post Top Ad

Space Iklan

Minggu, 16 Januari 2011

Cara Membuat Spoiler

Dalam sebuah blog/web yang banyak di pasang konten tertentu memang terlihat indah. Namun jika terlalu banyak konten/widget yang terpasang akan membuat halaman blog akan menjadi berat, dan tentu saja pengunjung akan malas untuk kembali lagi ke blog kita.
Maka dari itu, untuk menyiasatinya agar blog/web kita tidak terlalu berat, kita harus meminimalkan isi dari blog kita.

Salah satunya adalah dengan memasang spoiler di halaman blog kita. Fungsi spoiler sendiri adalah untuk menyembunyikan konten tertentu yang bisa di tutup atau di buka.
Dengan demikian loading blog kita akan terasa lebih ringan.

Berikut ini kode untuk membuat spoiler

<div><div style="margin: 5px;">
<div class="bigfont" style="margin-bottom: 2px;"><input value="Show" style="margin: 0px; padding: 0px; width: 60px; " 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 = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button">
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">

Isi konten sobat

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

Nanti jadinya akan seprti ini


Isi konten sobat


Semoga bermanfaat.
Alhamdulillah...

11 komentar:

  1. tas ngerti mas tentang spoiler coz bar nak konco blogger omong entok hadiah award tp di kek spoiler, sip" .. meluncur ahh

    BalasHapus
  2. kalo buat related post di bawah postingan , gi mana mas?

    BalasHapus
  3. . setelah saya menyimak dari awal hingga akhir, banyak sekali ilmu yang saya terima dari artikel yang anda tulia, semoga tambah bermanfaat ya lam kenal dan sukses selalu

    BalasHapus
  4. informasi yang sangat menambah wawasan saya makasih ga,.

    BalasHapus
  5. nice infonya.... sukses terus ea ditunggu artikel selanjutnya!!!

    BalasHapus

Post Top Ad

Space Iklan