Pages

Sabtu, 17 Oktober 2009

Cara membuat Spoiler

Hi semua^^..
Setelah sekian lama Isuta vacum dari dunia blogger, akhirnya Isuta kembali lagi (dasar emang gak bisa ninggalin dunia blogger. hehehe..).
Singkat cerita,
Tadi siang di sekolah Isuta ngeliat teman-teman Isuta, sibuk ngedit blog mereka buat tugas akhir perlajaran TIK. Terus, banyak juga teman-teman yang ngeluh karena blog mereka jadi berat loadingnya setelah mereka ngeupload video sama gambar yang ukurannya gede-gede. Nah, akhirnya Isuta kepikiran deh buat ngebuat postingan tentang spoiler. Hitung-hitung nolongin teman-teman sekelas Isuta dari loading blog mereka yang jadi kayak siput  + berbagi ilmu sama teman-teman blogger semua^^

Spoiler biasanya digunakan untuk memperkecil atau mempersingkat kode, postingan, atau tulisan apapun agar tidak terlalu memenuhi halaman.Spoiler ini dapat anda pasang pada side bar, halaman posting, header dan footer.Untuk membuatnya tidak sulit kok^^, co-past aja kode-kode dibawah ini.. (oh iya, yang Isuta tampilin ini adalah spoiler standar^^)





Tentang bla..bla.bla..



ini nih contoh spoiler^^


Cara membuat spoiler ini adalah sebagai berikut:
1.Copy dan paste kode dibawah ini
<div><div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;">Tentang bla..bla.bla.. </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 kode script, HTML, dan teks kamu disini

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

2.Selanjutnya gantilah tulisan seperti yang di bawah ini
Width: 55px adalah lebar kotak spoiler, ganti aja sesuai kebutuhan teman-teman.
font-size: 11px adalah ukuran huruf dalan kotak spoiler.Dapat diganti sesuai kebutuhan.
Tentang bla..bla... bisa di ganti dengan teks sesuai selera teman-teman, itu gunanya buat judul spoilernya gitu..
Isi kode script, HTML dan teks kamu disini dapat anda ganti dengan teks, kode script, gambar ataupun video, pokoknya suka-suka teman-teman deh^^

Gimana? Gak susahkan teman-teman? Oh iya, bagi teman-teman yag ngerti html, silahkan di utak atik aja kode-kode di atas untuk memodifikasi spoiler yang standar itu jadi spoiler hasil modifikasi teman-teman sendiri^^

4 komentar:

  1. hm...,.,. berguna gak ya? hm.,.,., di save ajalah dulu .,., thanks yua infonya ^_^

    BalasHapus
  2. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  3. info yg sgt bermanfaat buat aq terima kasih kawan.. keep post

    ma'af komentar aq yg tdi aq hapus soalnya gk lihat kalau udh ad yg pertamaxx

    BalasHapus
  4. @HAHAHA...dasar pengejar pertamax ni kk :P

    BalasHapus

di mohon comment nya >.< pasti isuta baca dan moderasi :) makasih banget lho :D