Tombol Show/Hide atau dikenal dengan sebutan Spoiler adalah tombol yang dipakai untuk menyingkat suatu tampilan obyek lain.biasanya spoiler ini digunakan pada saat kita memposting atrikel dan memasukan kode scrift yang jumlahnya sangat banyak sehingga melorot sampai kebawah.dengan tombol show/hide atau spoiler ini kita bisa menyingkat ruang postingan sehingga lebih enak dilihat.
Unutk lebih jelasnya sobat bisa lihat contoh seperti dibawah :
Judul Isi Spoiler:
Bagaimana cara membuatnya ? sobat tinggal memasukan kode berikut ini :
<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;"><b>Judul Spoiler</b>: <input value="Buka" style="margin: 0px; padding: 0px; width: 55px; font-size: 12px;" 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 = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" type="button">
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;"> Isi Spoiler <br>
</div>
</div>
</div>
Ket :
- Silahkan ganti tulisan berwarna Merah dengan judul spoile sobat
- Sobat bisa ganti tulisan berwarna Hijau dengan apapun yang sekiranya ingin disingkat.
Demikian cara membuat tombol Show/Hide atau tombol Spoiler semoga bermanfaat.
Terima kasih atas kunjungannya, silahkan berkomentar sesuai topik. Menuliskan link aktif tidak akan ditampilkan dalam komentar.Terima Kasih.