Spoiler adalah suatu fitur yang dapat menampilkan suatu objek di dalamnya dengan model show,hide. Spoiler banyak dijumpai di forum-forum. spoiler berguna untuk menghemat tempat. dengan spoiler, kita dapat menyembunyikan suatu objek dan menampilkannya dengan mengklik tombol spoiler.
Berikut langkah-langkahnya :
1. Pilih Rancangan
2. Pilih HTML/Java Script
3. Copy kode dibawah ini :
<div><div style="margin: 20px; margin-top:5px"><div style="margin-bottom: 2px;" class="smallfont"><input style="margin: 0px; padding: 5px; width: auto; " value="Show" 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 = 'Hidden'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button"/></div><div class="alt2"><div style="display: none;"><div style="border: none; color:none; background-color:none; text-align: justify; padding:10px;">
KONTEN KALIAN DISINI
</div></div></div></div></div>
4. Klik Simpan.
Keterangan script :
1. kode yang berwarna merah (style italic/miring) harus sama. kode ini sebagai judul tombol show/open. kalian bisa mengganti judulnya.
2. kode yang berwarna merah (tanpa style italic/miring) adalah kode untuk judul tombol hide/close. kalian bisa menggantinya.
3. kode yang berwarna biru adalah isi konten atau objek di dalam spoiler, kalian bisa menngantinya sesuai kebutuhan kalian.Selamat Mencoba Semoga Berhasil...
0 komentar:
Posting Komentar