Show & Hide Button Stylish

Itu yang aku maksud dan Sasya request like that
Hai temen-temen! Kali ini aku mau posting tutorial yang udah aku lingkarin. Tadi siang baru aja nambahin itu widget, eh, Sasya langsung kepo gimana caranya XD Kalian mau bikin kayak gitu? Itu sebenarnya show & hide button yang biasa. Tapi, itu aku sendiri yang edit. Yang mau tahu caranya, yuk ikutin langkah-langkahnya!
Langsung aja, yaa!

  • Dashboard > Tata Letak > Add A Gadget > HTML Javascript
  • Copy kode ini
<center><div id="spoiler"><div><input value="Your Title" style="width:150px ;font-size:12px; font-family: short stack; background-image: url(Your BG);-moz-border-radius: 7px; border-radius: 7px;margin:13px;padding:0px;border-style: 2px solid #A8E4FF;" type="button" onclick="if (this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[&#39;show&#39;].style.display != &#39;&#39;) { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[&#39;show&#39;].style.display = &#39;&#39;; this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[&#39;hide&#39;].style.display = &#39;none&#39;; this.innerText = &#39;&#39;; this.value = &#39;Hide Spoiler!&#39;; } else { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[&#39;show&#39;].style.display = &#39;none&#39;; this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[&#39;hide&#39;].style.display = &#39;&#39;; this.innerText = &#39;&#39;; this.value = &#39;Show Spoiler!&#39;; }" />
<div id="show" style="display: none; text-align: left; background-color:transparent; font-family: short stack; font-size:11px;background-repeat:repeat; border-radius:10px; border: 1px dashed #A8E4FF; background:url(YOUR BG); margin: 0px; border-width:2px;padding:3px; width:250px">
Replace Anything Here!</div></div></div><br />
</center>
  • Lalu, pastekan kode ini di kolom HTML Javascript yaa!
  • Save!
Kalo kalian mau kayak aku, jadi rules cbox, taruh aja di atas kode cboxnya! ^^
Selamat mencoba!

Kalo mau repost, tolong kasih credit namaku + link blogku, yaa! Ini aku sendiri yang edit!

Comments

  1. Anonymous30 December 2014 at 19:50:00 GMT+7

    Makasih loh kakkk ... hehehe ..maaf kepo lohhh dan maaf ngerepotin. x_x

    ReplyDelete

Post a Comment

Before leave a comment, please ensure your comment is supportive and spread positivity :)

Popular posts from this blog

Lomba Children Helping Children Tupperware 2015

Image
Halo temen-temen! Kali ini aku mau kasih info, yaa! Tahun 2015 awal Januari ini, Lomba Chidren Helping Children Tupperware  kembali lagi, loh! Kalo mau tahu selengkapnya, simak yukk! Tahun 2015 ini, lomba CHC tidak hanya mengarang cerita dan menggambar, lho! Tapi, ada lomba baru, yaitu lomba fotografi. Tapi, lomba ini hanya khusus untuk teman-teman yang menduduki bangku SMA yaa! Untuk info selengkapnya, bisa baca foto di bawah ini atau bisa baca infonya di bawah fotonya yaa! ^^ Karya Hebat, Bantu Sahabat Lewat Beragam Kreasimu! Selama 10 tahun anak Indonesia menolong sesama lewat 274.687 karya yang tercipta. Yuk, kirim karya gambar, cerita, atau fotografi (khusus SMA), karena setiap karya yang kamu kirimkan,Tupperware Indonesia akan mendonasikan Rp10.000,00 dalam bentuk peralaan sekolah kepada teman-teman yang membutuhkan. Tema Karya: MENOLONG Hadiah menarik menantimu! Juara 1 Rp. 5.000.000,- + laptop, piagam, dan produk Tupperware Juara 2 Rp. 3.000.000,- + la...
Read More >>

My Life Update

Image
Hi everyone! Here i am and i wanna share you about what i've been through this past. Looking my blog posts that i just posted a post in August, it really makes me a little dissapointed of myself huhu. Sorry i couldn't post something useful or entertain you guys in this occasion, so here are the reasons! Okay, credit this photo to Google, i just found this is soo aesthetic and take it as my post cover hahah. Lately, i got many assingments to do from my college even i haven't started my first academic year!! Yess, now i am a freshman. Those assignments have intention to prepare the freshmen for doing their study in college because as you know the environtment is quite different than high school and that is the college is working for educate us about character education. Start from this past two weeks, i'm busy to finish all of my assignments and until this second, i haven't finished it yet, lol. Actually it has two topics; about softskills and information technology t...
Read More >>

Movie About Insecurity : Imperfect

Image
Hai semuanya! Btw , ini tampilan blogger baru berubah gini ya? Jadi agak bingung wkwk. Okee, kali ini aku balik lagi dengan review film yaa. Film kali ini mengangkat isu insecurity , nih. Pasti kalian udah tau soal insecurity . Buat yang belum tahu, insecurity  merupakan kondisi di mana kita nggak nyaman dengan diri sendiri, bisa dibilang nggak pede gitu karena flawless . Tapi, di dunia ini memang nggak ada kan, manusia yang sempurna? Nah, sayangnya, banyak orang-orang di luar sana yang suka membuat standar kecantikan perempuan. Makanya kalo gendutan dikit, muka ada jerawat, dan lain-lainnya suka bikin nggak pede.  Mungkin beberapa di antara kalian juga mengalaminya? Cocok banget nih, Film Imperfect hadir untuk menghibur kalian! Judul : Imperfect  Tanggal rilis: 19 Desember 2019 (Indonesia)  Sutradara: Ernest Prakasa  Lagu unggulan: Pelukku untuk Pelikmu  Produser: Chand Parwez Servia  Skenario: Ernest Prakasa, Meira Anastasia Sinopsis Mine Version Ra...
Read More >>