Cara Membuat Custom Modal Menggunakan HTML dan CSS – Part 2

Cara Membuat Custom Modal Menggunakan HTML dan CSS – Part 2 – Setelah saya sudah pernah posting tentang cara menampilkan modal dengan bawaan dari bootsrap dan saya juga menambahkan animasi dari animate.css yang bisa sobat lihat disini. Pada kesempatan kali ini saya akan membuat modal sendiri dengan custom css yang tentunya bisa sobat ubah-ubah sendiri nantinya sesuai kreasi sobat. Oke langsung saja saya berikan contohnya.

 

Cara Membuat Custom Modal

1. Pertama kita perlu membuat file style.css dan isikan dengan kode dibawah

 

2. Kemudian buat file index.php dan isikan dengan kode berikut, namun sebelumnya saya pisahkan satu per satu karena ada 4 efek yang berbeda

a. Modal Standar

 

b. Efek muncul dari atas ke bawah

 

c. Efek muncul dari bawah ke atas

 

d. Efek muncul berputar

 

Jika berhasil maka kurang lebih tampilannya akan seperti gambar dibawah

 

Untuk selebihnya sobat bisa lihat pada demonya dibawah agar lebih jelas. Sekian postingan saya tentang Cara Membuat Custom Modal Menggunakan HTML dan CSS – Part 2. Jika ada salah-salah saya mohon maaf. Apabila ada pertanyaan maka bisa tinggalkan pada kolom komentar dibawah.

Baca juga :

Membuat Bootstrap Modal dan Animasinya pada PHP

Jika sobat ingin mendownload tutorial diatas maka sobat bisa klik link dibawah ini :

Sampai jumpa pada postingan saya selanjutnya..

 

Leave a Reply

Your email address will not be published. Required fields are marked *

three × 1 =