Breaking News
Loading...
Tuesday, April 5, 2011

Cara Membuat Spoiler di PHP dan HTML

4/05/2011
 
Malam sobat, malam ini aku mau berbagi cara untuk membuat spoiler. Sobat tahu kan apa itu spoiler ??? buat sobat yang sering Ngaskus atau aktif di dunia forum pasti sangat kenal dengan spoiler. Ok, langsung saja tanpa lama-lama, berikut kodenya :
<div style="margin: 5px 20px 20px;"> <div class="smallfont" style="margin-bottom: 2px;"><b>Spoiler</b>: <input value="Open" style="margin: 0px; padding: 0px; width: 55px; font-size: 11px;" 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 = 'Open'; }" type="button"> </div> <div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;"> <div style="display: none;">
Letakkan kode script, HTML, PHP dan teks anda disini
<br> </div> </div> </div>
Keterangan :
1.    Untuk tulisan Open dan Hide bisa sobat ganti sesuai keinginan.
2.    Width : 55px untuk lebar spoiler.
3.    Font-size: 11px untuk besar tulisan pada kotak spoiler.
4.    Tulisan Spoiler adalah judul, silahkan ganti sesuai keinginan sobat.

Hasilnya akan seperti ini :

Spoiler:



Letakkan kode script, HTML, PHP dan teks anda disini

Selamat mencoba sobat dan semoga bermanfaat :]

Sumber : Miscah Blog [ dengan sedikit perubahan ]
Rating: 5, Reviewer : Yufex E,

10 Comments:

  1. ternyata scriptnya sepanjang itu,,,
    padahal kalau di forum cukup pake [spoiler]isi[/spoiler]

    ReplyDelete
  2. @Bintang
    iya bro, mgkin di forum pke fungsi replace :)

    ReplyDelete
  3. thanks bgd gan.
    berguna bgd nih tutorial.
    barusan udah coba n working.. :D

    ReplyDelete
  4. @andri
    oke sama2 gan, smoga bermanfaat :)

    ReplyDelete
  5. Thanks gan. work perfectly.

    ReplyDelete
  6. Berhasil bro.... macacih ya... :)

    ReplyDelete
  7. kalo kita mw spoiler ny lebih dari satu gimana gan.?

    ReplyDelete

Terimakasih telah berkunjung di LpuARmy Blog, budayakan berkomentar dengan nama (jangan pakai Anonymous) dan baik yah :)

sankyu :)
- Admin LpuARmy Blog

 
Toggle Footer