Cara Membuat Pop Up Modal dengan W3.CSS
Kesuksesan datang kepada orang-orang yang menghargai waktu, teratur, fokus, menyelesaikan kesibukan satu demi satu dengan keyakinan. Oke di kesempatan kali ini saya akan berbagi ilmu kepada kalian mengenai bagaimana Cara Membangun Pop Up Modal dengan W3.CSS.
Pop Up Modal yaitu fitur pop up yang berisikan itu dapat mengenai gambar, keterangan dari suatu konten atau yang lain nya tapi dengan cara masih tetap pada halaman tersebut tanpa mesti pindah ke halaman lain yang dapat mempermudah si pengguna atau tamu di blog/blog teman-teman. Kelebihannya pun menjadikan variasi pada blog kita sendiri. Oke berikut Cara Membangun Pop Up Modal dengan W3.CSS.
Pertama-tama-tama, seperti biasanya siapkan terlebih dahulu file index.html nya.
Kemudian, isi di bagian <head> link bagi menghubungi index dengan W3.CSS.
<link rel=stylesheet href=http://www.w3schools.com/lib/w3.css>
Setelah itu, isi di bagian <body> tag-tag seperti gambar di bawah.
<body class=w3-container>
<h2>W3.CSS Modal</h2>
<button onclick=document.getElementById('id01').style.display='block' class=w3-btn>Klik disini!</button>
<div id=id01 class=w3-modal>
<div class=w3-modal-content>
<div class=w3-container>
<span onclick=document.getElementById('id01').style.display='none' class=w3-closebtn>times;</span>
<p>Ini paragraf di modal</p>
<p>Ini paragraf di modal</p>
</div>
</div>
</div>
</body>
Bagaimana teman-teman? lumayan gampang bukan?
Demikian bagi panduan kali ini mengenai Cara Membangun Pop Up Modal dengan W3.CSS.
Semoga bermanfaat, terima kasih
Sumber https://kursuswebsite.org
