
Contoh spoiler yang belum terbuka. |
Contoh spoiler yang sudah dibuka. |
Berikut adalah kode spoiler yang bisa langsung di gunakan, copy kode spoiler yang bercetak miring dibawah ini dan paste pada halaman HTML pada saat membuat atau edit sebuah postingan. Ingat pada halaman edit posting jangan lupa pilih mode HTML jangan compose.
<div id="spoiler1" style="display: none;">
ISI KONTEN
</div>
<button onclick="if(document.getElementById('spoiler1') .style.display=='none') {document.getElementById('spoiler1') .style.display=''}else{document.getElementById('spoiler1') .style.display='none'}" title="TEXT YANG MUNCUL PADA SAAT CURSOR MOUSE BERADA DI ATAS TOMBOL SPOILER" type="button">JUDUL TOMBOL SPOILER</button>Keterangan tambahan :
- ISI KONTEN adalah tempat untuk meletakan text kalimat, gambar, atau sebuah iframe.
- Angka 1 pada tulisan spoiler berfungsi untuk membedakan setiap spoiler pada sebuah halaman website. Contoh kita ingin menggunakan lebih dari 1 spoiler maka saat kita membuat spoiler kedua harus menggunakan div id yang berbeda tentu langkah mudah yaitu dengan menambahkan sebuah angka.
- TEXT YANG MUNCUL PADA SAAT CURSOR MOUSE BERADA DI ATAS TOMBOL SPOILER adalah kalimat yang bisa kita ganti sesuka hati untuk mendeskripsikan sebuah tombol apabila cursor mouse berada di atas tombol.
- JUDUL TOMBOL SPOILER adalah tulisan yang berada di sebuah tombol dan bisa juga terlihat seperti nama atau judul tombol spoiler.
Berikut contoh kode spoiler untuk spoiler kedua
<div id="spoiler2" style="display: none;">
ISI KONTEN
</div>
<button onclick="if(document.getElementById('spoiler2') .style.display=='none') {document.getElementById('spoiler2') .style.display=''}else{document.getElementById('spoiler2') .style.display='none'}" title="TEXT YANG MUNCUL PADA SAAT CURSOR MOUSE BERADA DI ATAS TOMBOL SPOILER" type="button">JUDUL TOMBOL SPOILER</button>Sekian artikel tentang Membuat Spoiler di Blogspot, semoga artikel ini bermanfaat bagi kita pemilik website yang ingin membuat halaman website menjadi lebih rapi dan menarik.
Terima kasih sudah berkunjung dan membaca artikel ini.
Comments
Post a Comment
1. Berkomentarlah dengan sopan.
2. Berdiskusilah dengan bijak.
3. Dilarang SPAM.
4. Dilarang SARA.
5. Dilarang menuliskan tautan link aktif.