1.09.2010

Mengubah Teks Menjadi Spoiler

Oke kawan...yang terakhir adalah teks yang di rubah menjadi spoiler berikut kodenya yaaaaaaaaaaaaaaaa :
<div id="aditya"><div><div id="show" style="display: none;"></div><div id="aditya"><div><p style="width:100px; color:#00FF00;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = ''; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = 'none'; this.innerText = ''; this.value = 'Hide aditya!'; } else { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = 'none'; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = ''; this.innerText = ''; this.value = 'Show aditya!'; }">Teks yang akan di jadikan spoiler</p><div id="show" style="display: none; color:red;">TEKS DAN GAMBAR YANG INGIN DI TAMPILKAN</div></div></div></div></div>
Contoh:

Kalo Aditya Cakep Klik Di SINI(hehe)

Keterangan Vital :
color:#00FF00 adalah warna teks yang akan di jadikan spoiler
color: red adalah warna teks ISI dari spoiler
(mudeng ga? di coba aja yoooooo.......)

Kelemahan spoiler ini adalah baik form/teks/gambar tidak bisa di sisipkan kedalam paragraf jadi butuh spasi baru untuk meletakan spoiler tersebut, saya akan coba ngutak-ngatik lagi n cari-cari tutorial lagi untuk di modifikasi agar form/teks/gambar bisa di sisipkan kedalam paragraf dan isi dari spoiler bisa melayang di atas paragraf, tanpa mengganggu tulisan lainya (bingunggggggg??????????) tunggu aja deh....sementara pake yang ini aja lagian kan kebanyakan spoiler versi ini yang di pakai oleh para blogger ya toh?
Tak tunggu komentarnya n saranya bila ada yang salah ya.....yang jelas scritpt-script spoiler ini berfungsi kok kan udah tak kasih contohnya toh ? seperti biasa klo ada yang mau kopas untuk konten blognya....jangan lupa sertakan sumbernya ya.......trims bgt.

18 komentar temen:

None mengatakan...

boleh ni di coba, besok yah mas, klo sempet, khehehe.. udah malemmm ngantukkkkkkk ^_^

Edo Belva mengatakan...

wuih...rajin banget mas bikin giniannya,,hehe

Sohra Rusdi mengatakan...

inul untuk gambar yang sembuni itu yah mas wah makasih tutorialnya saya belum pernah pakai spoiler karena memang belum tahu

ellysuryani mengatakan...

Info mantap. Cuma kalau yang membaca gaptek seperti saya ya musti dimamah pelan-pelan. Dit ajarin mengubah blog saya jadi dofollow dong....

tukangpoto mengatakan...

Wah ora mudeng aku mas Adit, spoiler itu apa sih ? soalnya nggak ngikutin dari pertama sih..nanti tak baca dulu seri pertamanya..

SeNjA mengatakan...

infonya ok dit,...mksh ya...nanti aku coba ahh,tapi berhubung aku gaptek harus pelan-pelan dit... ^_^

Yudistira Akbar mengatakan...

lah, kalo yang spoiler biasa gimana mas?

tapi htmlnya agak ribet juga ya..

Clara Canceriana mengatakan...

hehehe, tips ini bagus nih
tapi pasti saya males pake
tepatnya males ngutak ngutak

Unknown mengatakan...

Iya, iya...Aditya emang cakep kok, hehehe

Fais Wahid mengatakan...

mantap ni tutor'y mas.

Anonim mengatakan...

hahaii tutor yang bagus..
thanks...

Ninda Rahadi mengatakan...

aku gapaham mas T__________T

imam77 mengatakan...

Kabar Baik sob,,'
sendirinya gmna?? wew,, mantap nih artikel, di coba ahhh!!

suraduja mengatakan...

sob saya pengen nanya nih, ketika spoiler teksnya di klik, kan keluar teks lagi di bawahnya, nah saya pengen ngeluarin teks nya di samping spoilernya, gmana itu sob, soalnya mau saya pasang di bagian footer bar blog saya, kan gak seru kalo sampingnya itu kosong, thank's ya sob

Blogger Admin mengatakan...

@suraduja....sebenernya sih bisa.....ntar saya buatkan tutorialnya yah.....sementara ini dulu....ada model spoiler lain yaitu spoiler melayang......ntar saya post kan siapa tau bermanfaat!!!

suraduja mengatakan...

thank's ya sob tutorialnya saya tunggu

suraduja mengatakan...

oya, tutorial yang ini juga udah saya pake untuk footer blog saya, coba anda lihat di bagian paling bawah footer di blog saya yang ada tulisan "<< >>", sip lah sob, lanjutkan........

Tubagus mengatakan...

" Teks anda disini "

udah di ganti tp gak berubah . . . . .