Kalau anda sering mampir ke forum-forum seperti kaskus, vivanews atau yang lainya tentu sudah tak asing lagi dengan spoiler, kode untuk spoiler di forum biasanya seperti ini : [spoiler="Judul Spoler"]Isi Spoiler[/Spoiler] bahkan ada yang sudah menambahkan di menu post.
Pada umumnya spoiler di forum-forum tersebut digunakan untuk menghemat tempat karena gambar atau text yang terlalu banyak atau terlalu besar, selain itu bisa mempercepat tampilnya halaman karena tidak di load secara bersamaan.
Lalu bagaimana di blogspot???? ternyata caranya tidak sama dengan di forum. Agak banyak kodenya tapi bukan masalah bisa di copas kok :D
Berikut ini kode untuk menyembunyikan text saat posting di blogspot dengan menggunakan spoiler :
<div>
<div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;">
<i><span style="font-weight: bold;">Judul Spoiler </span></i><input 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'; }" style="margin: 0px; padding: 0px; width: 60px;" type="button" value="Show" /></div>
<div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px;">
<div style="display: none;">
isi spoiler...
</div>
</div>
</div>
</div>
Penerapanya yaitu pada saat posting copas code di atas, dan silahkan ganti text yang berwarna dengan judul dan ini spoiler.
Impementasi dari kode ditas seperti berikut :
Judul Spoiler
Tidak ada komentar:
Posting Komentar