Masukan Email Kamu Untuk Berlangganan Berita Terbaru Dari Blog Ini

15 Juli 2011

Membuat Spoiler Pada Posting Blog

TwitThis
Untuk sobat yang aktif di forum pasti sudah tidak asing lagi dengan spoiler ini.
Spoiler adalah cara untuk menyembunyikan seluruh atau sebagian isi dari konten blog kita. Spoiler juga bermanfaat agar konten yang berat seperti gambar dalam ukuran besar dan video tidak diload sebelum menekan tombol show. Dengan kata lain spoiler membantu kita mengurangi waktu load konten blog dan memberikan pilih kepada pembaca blog untuk membuka atau tidak isi spoiler. (berlaku juga untuk web)

Berikut adalah kode javascipt yang harus ditambahkan dalam posting:

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

Keterangan:

    * Warna merah yang ada dapat diganti sesuai dengan keinginan.
    * "isi spoiler" dapat di ganti dengan text, gambar, musik, atau video.
    * Untuk musik dan video yang dimasukan adalah embed kode.
    * Apa bila spoiler berupa gambar maka di upload terlebih dahulu lalu di ambil linknya.

Artikel Terkait

0 komentar:

Posting Komentar

Silahkan tinggalkan komentar sobat...

 
free counters

Pengikut

Twitter Blog Templates © Copyright by Download Software Gratis | Template by BloggerTemplates | Blog Trick at Blog-HowToTricks