Kode HTML spoiler di blogspot

Pengguna blogger/blogspot dari google, sebelum ke pokok artikel ini New BerryMor akan menjelaskan sedikit tentang spoiler ini. Spoiler dibuat dengan menggunakan javascript button. Sedangkan untuk menyembunyikannnya digunakan properti CSS display, seperti, "display:none;". Fungsinya ada banyak sekali, diantaranya untuk memperpendek teks, menyembunyikan gambar yang besar dan panjang dan memakan space halaman atau bisa disebut menyembunyikan konten dan lain-lain, sehingga tampak spoiler.


Lihat contoh yang New BerryMor praktekkan,dan klik spoiler dibawah ini :





Untuk contoh kode HTML spoilernya dibawah ini silakan salin jika mau :

<div id="spoiler" style="display:none">
Konten kamu disini
</div>
<button title="Clik for open and close" type="button" onclick="if(document.getElementById('spoiler') .style.display=='none') {document.getElementById('spoiler') .style.display=''}else{document.getElementById('spoiler') .style.display='none'}">Open | Close</button>

Catatan New BerryMor tentang menggunakan kode HTML spoiler ini :
  • Ganti Konten kamu disini (text, url, url gambar, script dan lain-lain) yang ingin disembunyikan.
  • Ganti title Clik for open and close dengan title yang kamu inginkan. Title berfungsi memberi informasi ketika mouse di hover atau disorot di tombol spoiler.
  • Ganti Open | Close dengan teks sesuai keinginan, teks tersebut akan menjadi perintah yang terlihat pada tombol spoiler.

Bagaimana!,sudahkah kamu praktekkan?,jika belum, silakan praktekkan dan berkreasi semoga berhasil ;)

6 komentar:

Masih belom mengerti gan... gak tau juga.. semua itu di mana nyimpan nya? di postingan atau di Html nya Template?

Eel : dipostingan juga bisa El, untuk diletakkan tambah gadget,widget juga bisa tergantung kamunya mau diletakkan dimana saja.

Coba kamu praktekkan dihalaman posting dulu setelah itu jangan langsung dipublikasikan akan tetapi pratinjau dahulu.

Setelah kamu praktekkan kamu akan mengerti coba saja :)

BOSS New BerryMor yg KEREN ABIES!!!
Model SPOILER yg Keren Boss...Ayas sblumnya dah makek Model yg judulnya disamping....
Hemm,,,kyaknya MODEL ini Keren juga Klo diPakek diPostingan neh...Hwehehe..
Ijin COPAS yach Boss.
SEMAKIN SUKSES BOSS!!

Ayas : Silakan di copas yas,maaf baru dibalas nih :)

Ijin pake ya sob,makasih triknya,salam erat persahabatan dari Papua!

Er'end : Silakan er'end,kita memang sudah bersahabat sebelumnya er'end :),kamu punya blog is the best.

Untuk sahabat blogger, saya New BerryMor mohon maaf sebesar-besarnya karena saya belum sempat berkunjung kembali ke blogger sahabat,karena saat ini terusterang saya masih dalam suasana Berduka,jadi harap dimaklumi,dan jika suasana sudah agak sedikit reda saya akan berkunjung ke blogger sahabat terutama buat Eel,Bagio,Er'end dan juga teman yang sudah bergabung sesama blogger.

Terima kasih sebesar-besarnya atas masih kesediaanya untuk berkunjung ke blog New BerryMor,semoga kita dalam perlindunganNYA Amin

Untuk kalian semua semoga blogger kalian semakin sukses dan salam New BerryMor

Posting Komentar

Share

Twitter Delicious Facebook Digg Stumbleupon Favorites