Cara Membuat Efek Blur Pada Menu Menggunakan CSS3

Hallo teman-teman DUMET School, pada tutorial saya kali ini, saya akan mengajarkan bagaimana caranya membuat efek blur pada menu menggunakan CSS3 transitions. Seperti yang kita ketahui, di CSS kita juga bisa membuat animasi-animasi atau efek-efek yang sangat brilian dan hasilnya tidak kalah bagusnya ketika kita membuatnya menggunakan jQuery. Nah di bawah ini kita akan mencoba membuat efek Blur Pada Menu menggunakan Property CSS3 yaitu Transitions. Jadi nanti ketika kalian arahkan kursor pada salah satu menu maka menu yang lainnya akan menjadi Blur. Nah untuk membuat nya kalian bisa mengikuti langkah-langkah nya di bawah ini.

Pertama kalian bisa buat satu file dengan nama index.html, dan tuliskan struktur HTML di bawah ini didalam file index.html yang sudah kalian buat.

Kemudian untuk CSS nya kalian bisa tuliskan dari baris program berikut.

Maka hasilnya seperti di bawah ini.

See the Pen PZEvMV by Dumet_School (@dumet_school) on CodePen.

Download

22 Januari 2016

Webinar Gratis 2024


Selanjutnya Pada Bulan Maret 2024

Sabtu, 09 Maret 2024


10 Bahasa Rekomendasi Untuk Dipelajari di 2024

Python Developer, Data Science, Web Application

Kursus Python Django Web Application 2024 di DUMET School Mini Bootcamp Backend Laravel 11 Bulan Mei 2024 di DUMET School
Webinar Selanjutnya Mei 2024

Minggu, 26 Mei 2024, 09.00-13.00 WIB

(4 Jam Membuat Backend di Laravel 11)

chat