3 Macam Membuat Spoiler ( menu Show and Hide )
Caranya tinggal copy dan pastekan pada blog kita.
1. Spoiler I :
<div>
<input style="margin:0px;padding:0px;" 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 = 'Sembunyikan'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Tampilkan'; }" type="button" value="Tampilkan" /></div>
<div style="border: 0px solid #000000; margin: 10px auto; padding: 5px; background: #c9d2ed none repeat scroll 0% 0%; width: 500px;">
<div style="display: none;">
DI SINI ISI SPOILER ( BISA IMAGE, JAVASCRIPT DLL )</div>
</div>
Contohnya lihat di bawah ini.
<div style="border: 0px inset gray; padding: 1px;"><div style="text-align:center;" ><button type="button" class="button" onclick="this.parentNode.parentNode.childNodes[1].style.display = ''; this.parentNode.style.display = 'none';" title="Klik Aja" ><span style="color: rgb(0, 0, 0);" ><b>Ganti Dengan JUDUL SPOILER</b></span></button></div><div id="spoiler" style="display: none;"> DI SINI ISI SPOILER ( BISA IMAGE, JAVASCRIPT DLL )</div></div>
Contohnya lihat di bawah ini.
<div><div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;">Judul Spoiler Anda </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;">
DI SINI ISI SPOILER ( BISA IMAGE, JAVASCRIPT DLL )
</div></div></div></div>
Contohnya lihat di bawah ini.

Anda Sudah Baca Yang Ini? :
- Bertakwalah kepada Allah (QS. Al Hasyr : 18)
- Kendalikan hawa nafsu marah
- Berprasangka baik dapat pahala
- Sesama Manusia Budayakan Saling Menasehati
- Mengingat kebaikan dan memberi pujian bagi orang yang telah meninggal dunia
- Kenapa dan mengapa Para Pejabat Indonesia banyak yang KORUPSI?
- Cara mudah membuat posting Kode HTML Java Script di Blogspot / Wordpress
- Cara membuat Favicon atau Icon di browser Blog anda dengan mudah
- Cara mudah membuat Blog. (Bagi Blogger Pemula)
- Free Download Mp3 Bob Marley (Gratis)
- Blog yang Menghasilkan Uang Milyaran Per Tahun
- Daftar Lengkap Submit ke directory dan Submit ke social bookmark
- Cara Membuat Iklan Melayang di Blog
- Google Adsense Problem Pin
- Kenapa Blog Kluwan dot com Page Rank Turun? Djadwal Google PR up-date
- Cara Membuat Daftar Isi Blog 2
- Cara Membuat Daftar Isi Blog 1
- Hasil Pertandingan Google Page Rank dengan Blogku
- Award From Dhana Arsega / 戴安娜 With Love Best Wishes
- Cantiknya Seri Bahasa Community Blogger Award
- Cara Setiap Posting Blog Tampil di Facebook
- Mulai Bulan Maret 2010 Perfect Money for Business Tidak Bayar kecuali PR 5
- Menu Horizontal Css dengan Drop Down yang Cantik Menarik
- Alexa Semakin Gendut
- Cuma lima menit Hanya Daftar Dapat $50 dari DomainIT
- Kenapa dan mengapa Para Pejabat Indonesia banyak yang KORUPSI?
- Cara mudah membuat posting Kode HTML Java Script di Blogspot / Wordpress
- Cara membuat Favicon atau Icon di browser Blog anda dengan mudah
- Cara mudah membuat Blog. (Bagi Blogger Pemula)
- Daftar Lengkap Submit ke directory dan Submit ke social bookmark
- Cara Membuat Iklan Melayang di Blog
- Google Adsense Problem Pin
- Kenapa Blog Kluwan dot com Page Rank Turun? Djadwal Google PR up-date
- Cara Membuat Daftar Isi Blog 2
- Cara Membuat Daftar Isi Blog 1
- Hasil Pertandingan Google Page Rank dengan Blogku
- Award From Dhana Arsega / 戴安娜 With Love Best Wishes
- Cara Setiap Posting Blog Tampil di Facebook
- Menu Horizontal Css dengan Drop Down yang Cantik Menarik
- Alexa Semakin Gendut
- Cuma lima menit Hanya Daftar Dapat $50 dari DomainIT
- Ikutan yuk di Review NegeriAds.Com
- Cara Mengembalikan "Title / Judul" Blog yang Hilang
- Younger Tip with Tomatoes
- Cara Membuat Navbar Blog Auto Show and Hide 3
- Cara Untuk menampilkan navbar blogger 2
- Menampilkan Navbar yang hilang pada Blog
- Navbar Styles Transparans baru
- Khasiat Buah Pare Pencegah Kanker Payudara, Diabetes dan Infeksi
- Cara memasang kode Sign in pada Blogger di Blog
- Kenapa dan mengapa Para Pejabat Indonesia banyak yang KORUPSI?
- Cara mudah membuat posting Kode HTML Java Script di Blogspot / Wordpress
- Cara membuat Favicon atau Icon di browser Blog anda dengan mudah
- Blog yang Menghasilkan Uang Milyaran Per Tahun
- Daftar Lengkap Submit ke directory dan Submit ke social bookmark
- Cara Membuat Iklan Melayang di Blog
- Google Adsense Problem Pin
- Kenapa Blog Kluwan dot com Page Rank Turun? Djadwal Google PR up-date
- Cara Membuat Daftar Isi Blog 2
- Cara Membuat Daftar Isi Blog 1
- Hasil Pertandingan Google Page Rank dengan Blogku
- Award From Dhana Arsega / 戴安娜 With Love Best Wishes
- Cara Setiap Posting Blog Tampil di Facebook
- Mulai Bulan Maret 2010 Perfect Money for Business Tidak Bayar kecuali PR 5
- Alexa Semakin Gendut
- Cuma lima menit Hanya Daftar Dapat $50 dari DomainIT
- Ikutan yuk di Review NegeriAds.Com
- Cara Mengembalikan "Title / Judul" Blog yang Hilang
- Younger Tip with Tomatoes
- Cara Membuat Navbar Blog Auto Show and Hide 3
- Cara Untuk menampilkan navbar blogger 2
- Menampilkan Navbar yang hilang pada Blog
- Navbar Styles Transparans baru
- Cara memasang kode Sign in pada Blogger di Blog
- Cara Google Translate Widget Tambahkan ke blogger
41 komentar:
=)
salam sahabat
wah siip n siip dhek sangat bermanfaat thnxs n good luck ya
=))
:x wow..keren nich sobat
wah tq banget yah om
heheh^^
jadi ngerti sekarang hoho
:-t
Mbak Dhan dan Mas Heru, makasih deh...
:.((
Mich kok manggil Om cih? hik...huwaaaa....
yah...
jgn nangis hoho :)
keep smile yah cc :)
haha
;;)
@ smile lagi...
Makasih deh Mich... :)
Mantap Dinda..
Aku kayaknya paling suka pake yang nomer 2.
makasih banyak.
cc...
kok namanya khusnul ?
nama panggilan cc apa?
haha
=)) =)) =)) :X:X:X :)) :)) :))
keren !
Skrg blog km jd enteng dik pake spoiler...
Coba ahhh...
Sippp...
wuih keren... makasih mba...ilmunya...
:(( :(( :((
cc...
cara bikin tabview kyk cc itu gmn y? hoho...
Para Blogger Iklan kan Blog anda semua
Di Http://iklannyata.blogspot.com .
Blog Iklan gratisssss & Tingkatkan PageRank Blog anda
wah keren.. bisa dicoba nih.. biar blog jadi enteng.. makasih mbak ^^
Tq info nya.
Jgn lupa, artikel yg hrs d baca untuk para cewek di Galeri Fhoto. Baca ya?
lumayan nambah ilmu lagi.....ini sih kayaknya buat postingan semacam tebakan atawa teka teki.....jawabannya ....baru kita klik. salam.
sip nih tutorialnya... salam kenal ya... boleh tukeran link ga? link blog ini udah saya pasang di halaman blogroll blog aq...
Spoiler.. spoiler..
aku senang menggunakan ini, aku baru bisa satu macam, tp ini ada 3 pilihan...
hore....
Copas2...
datang disini baca tutorial spoiler
Ilmu yang mantap lagi khus. Terima kasih ya. Yang paling penting kita harus mengerti bagaimana cara untuk menggunakannya. Hik....
mantab nih dek langsung mas coba, mas suka yang tampilan yang pertama, sip dek
nice your blog
b-(
Wah Padahal Tutorial tentang Spoiler sudah banyak.
8-}
Terima kasih sekali buat semua yang telah berkomentar pada blog sederhana ini.
dek kok g d post tw pertanyaane mas, yang kaya d komentare ade'
wah... keren nih.. coba2 utak atik ah entar... thanks for sharing ya?
Wow ribet amat ya? akan aku usahin biar bisa... thanks ya..
Nice info my friend, ini satu ilmu baru lagi nih buat nyubi kyk aku.....
@ Rizky2009, sudah nih mas coba lihat ini :
http://kluwan.blogspot.com/2009/12/cara-membuat-arsip-blog-site-map-label.html
:-t
@ misterdicious, maksih
@ Bang Ancis, Bang masak sih ribet? boong ah...
@ Goaplek, he he ... bukan newbie ah...
mantap.....salut aku..
Makin bagus aja blognya adik kita ini comment balik ya
Willyo Alsyah P. Isman + MULYONO W SPd, langsung ke tkp...
:)]
wah keren De' kak Riv mau cba biar tmbh simple Blog kakak ......
mengamankan yg ke 38 dlu... :D
mantabz sob post nya
oce sob ane coba dulu yaaa...
oy tengkyu yaaa ilmunya..
Goodluck ya...
mantap.. lengkap nih :))
Post a Comment