Waktu saat ini menunjukan

Rabu, 10 Agustus 2011

membuat spoiler pada artikel blog

umm,Spoiler, yap.. ini merupakan alternatif dari pembuatan readmore ..
itu fungsinya untuk meringkas artikel pemosting artikel sekaligus buat menarik perhatian reader buat membaca lebih lengkap lagi ..
umm, contoh penggunaan terbanyak adalah pada http://kaskus.us ,
nah, kalau masih bingung ini contohnya

Judul spoiler
isi spoiler anda , dimana bisa dimasukkan artikel yang panjang disini



nah minat untuk mencoba ?
ini dia code.nya
jeng..jeng..


<div><div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;">Judul dari spoiler</span></i><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>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">
isi dari spoiler yang akan ditampilkan
</div></div></div></div>

Teks yang berwarna hijau muda adalah teks yang harus anda ganti sesuai kebutuhan sobat ..
nah, selamat mencoba :)

4 komentar:

Core Zee Khan mengatakan...

thanks gan informasinya, membantu banget.

All Shares 4 You mengatakan...

itya , sama" gan :D

Anonim mengatakan...

sip sip, mau nyoba aah~

All Shares 4 You mengatakan...

silahkan mbak :)
kalo mau request apa" silahkan comment , atau sms laah :D

Posting Komentar