Senin, 06 Juni 2011

0 Membuat Spoiler Sederhana Pada Blog

Mungkin sudah banyak yang membahas tentang cara membuat spoiler. Coba saja search di Mbah Google. Namun saya akan mencoba membahas dengan cara saya yang lain. Ketika kita menulis artikel yang lumayan panjang dan mencantumkan beberapa gambar, apalagi gambar tersebut memakan memori yang cukup besar a.k.a BW a.k.a Bandwith Killer. Yaitu menyebabkan loading menjadi lama alias lama.

Kalau kita melihat di forum-forum seperti : Kaskus, Indowebster, dll. Maka, untuk mengatasi hal tersebut di buatlah spoiler. Jika di Kaskus untuk menampilkan sebuah spoiler hanya mengetikan tulisan :
[spoiler=judul spoiler] isi judul [/spoiler]. Apakah bisa kita terapkan hal seperti itu di blog? Jawabannya tentu bisa, kita hanya perlu mengcopy-paste artikel di bawah ini :

<div><div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><i>Judul Spoiler </i><input value="Show" style="margin: 0px; padding: 0px; width: 80px; 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>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="">

Isi Posting / Artikel

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

contoh


Judul Spoiler




Isi Posting / Artikel

0 komentar:

Posting Komentar