Minggu, 11 April 2010

Cara membuat spoiler pada post

| Minggu, 11 April 2010 | 28 komentar
Selamat membaca artikel diblog ini semoga bermanfaat :)

Trik blog,Apa spoiler itu?Spoiler itu adalah sesuatu yang dipakai untuk dapat menyembunyikan link, gambar, dll.ini digunakan untuk mempercepat loading blog kita
tertarik?mari kita buat

-Membuat spoiler yang menyembunyikan text




Apa spoiler itu?Spoiler itu adalah sesuatu yang dipakai untuk dapat menyembunyikan link, gambar, dll.ini digunakan untuk mempercepat loading blog kita
tertarik?mari kita buat

kodenya:
<div style="margin: 5px;">
<div class="bigfont" style="margin-bottom: 2px;"><input value="Open" style="margin: 0px; padding: 0px; width: 60px;" 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 = 'Close'; } 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;">Apa spoiler itu?Spoiler itu adalah sesuatu yang dipakai untuk dapat menyembunyikan link, gambar, dll.ini digunakan untuk mempercepat loading blog kita
tertarik?mari kita buat</div></div></div>


-Membuat spoiler yang menyembunyikan gambar



.

Kodenya:
<div style="margin: 5px;">
<div class="bigfont" style="margin-bottom: 2px;"><input value="Open" style="margin: 0px; padding: 0px; width: 60px;" 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 = 'Close'; } 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: 0px none ; margin: 0px; padding: 6px;"><div style="display: none;"><div style="background: rgb(180, 123, 16) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwIfMVCzTn29Te_IGomXtJvBWLiNfx-sBbQoUkrmjB2iwiodjAhCKx5XHGSJbb1EXU_P5n8Jsfb4gfybFn4X2RN4z_MyFWO1fdnHSAX5W_wvPXuZOPm3Whjyl-UzzZ22W53Vt5ci_Waqha/s1600-h/Lawak.jpg"><img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer; width: 305px; height: 400px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwIfMVCzTn29Te_IGomXtJvBWLiNfx-sBbQoUkrmjB2iwiodjAhCKx5XHGSJbb1EXU_P5n8Jsfb4gfybFn4X2RN4z_MyFWO1fdnHSAX5W_wvPXuZOPm3Whjyl-UzzZ22W53Vt5ci_Waqha/s400/Lawak.jpg" alt="" id="BLOGGER_PHOTO_ID_5425016435368354930" border="0" /></a>.</div></div></div></div>

*keterangan:
kode yang berwarna orange adalah alamat gambar
Selamat mencoba!

28 komentar :

uchu mengatakan...

Mantab Gaan,. tapi cobanya ntar aja yaaah, hhee

gudangblog mengatakan...

Hihi,,, mantap kang,,,,'
ane da pernah nyoba... keren nih post.. kalau ane mau pake lagi bisa kesini nih...

sms cinta mengatakan...

makasih script nya bos
bagus tuh bisa mempercepat loading blog kita

mas doyok mengatakan...

sip hobi anak kaskus nih :) bikin spoiler :0
tapi sampai saat ini saya jarang gunakan

KangTiar mengatakan...

wah Seperti KASKUS.US ya....manthap

jose sbastians mengatakan...

wow... Spoiler,, Good.
Very interest...

Regi_Adi mengatakan...

saya ngga pernah pake spoiler Sob... saya lebih suka teks dan gambar tampil.. walaupun kepanjangan...hehehe

darahbiroe mengatakan...

makasih infonya
sangat bermanfaat nuy
buat temen2 yang lagi mo buat spoiler
thanks

antok mengatakan...

wahh bisa menghemat tempat yaw
klo pake spoiler ini makasih
udah share

secangkir teh dan sekerat roti mengatakan...

saya juga pengen pasang.. tapi ada gak yang lebih cantik rupanya... :D

Unknown mengatakan...

hehheehe keren emnag lo pake spoiler...

rasta mengatakan...

wah mantap ne blog.....
keep posting sob

benniantoni mengatakan...

mantaap gan ..
ijin nyoba yah gan ..
Hhe :)

idhanq mengatakan...

mantab nih gan, izin bookmark dolo! spoiler mah ciri khasnya KASKUS

Dheny Gnasher mengatakan...

Wah yang biasanya dipake dikaskus ya hehehhe

akhatam mengatakan...

Wah mantap nih sob triknya.. ku simpan yaw buat n'tar kalo perlu.. tx

Unknown mengatakan...

wah langsung coba ajh..

Rizki mengatakan...

Bagus tuh buat menghemat space. Tapi bukannya klo pake spoiler itu malah bikin berat yak?

BeDa mengatakan...

Spoiler. Ada keuntungan, dan ada kerugiannya ya. Untungnya menghemat space, bisa bikin penasaran dan suprise juga. Kerugiannya, bikin lebih lambat. Untuk yang terakhir ini perlu dibuktikan dan dipastikan. Iya kan?

Salam ukhuwah

www.nukangdesign.com mengatakan...

mantab gan .......

shidiq mengatakan...

Di Page One aja deh....
Manteb Tutorialnya Gan

chordsmantap mengatakan...

thx tutorial gan,, bikin betah nich di blog ini,,salam kenal kang

Lutfi Setiyawan mengatakan...

wkwkwkwk . . .
sama" . . .

Lutfi Setiyawan mengatakan...

kayak forum yah, pake spoiler .
sama pake quote juga .
sipp deh, bisa bwt postingan lebih minii

Rizkyzone mengatakan...

keren tuh sob, kalau aq tak terapkan di sidebar

idhanq mengatakan...

mantab sob! ijin bookmark. ane joba. jadi kaya thread di kaskus. hehehe

aLamathuR d'hileudjapanist II mengatakan...

Ini dia yang saya butuhkan... beberapa tulisan artikel saya memang membutuhkan spoiler semacam ini... meskipun sebenarnya ga pake juga belum terlalu mengganggu loading halaman sih.. tapi siap tau bakal lebih ngebut lagi loadingnya kalo pake spoiler...

Makasih banget ya gan.. ilmunya kepake banget, mudah2an jadi amal baik dengan bagi2 ilmu..

Ahmad Maryuki mengatakan...

praktek gan...mantaf :X

:)) ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =))

Posting Komentar

 

Blogroll

Flagcounter

free counters
© Copyright 2010. K-blogger . All rights reserved | K-blogger is proudly powered by Blogger.com | Template by o-om.com - zoomtemplate.com
Pasang Iklan Gratis Sebagai Awal Mulai Bisnis Online