Cara membuat menu dropdown yang terpisah dari menu

Hai teman-teman dumetschool !

Menu dropdown memiliki banyak variasi dalam pembuatan tampilannya. Dari segi posisi juga memiliki beberapa jenis. Namun ada intinya untuk variasi posisi menu hanya ada 2 macam saja secara garis besar yaitu menempel di area menu atau secara terpisah dari area menu.

Beberapa waktu lalu ada seorang murid yang menanyakan bagaimana agar menu saja tidak menempel namun dorpdownnya juga tidak langsung menghilang. Jawabannya sangat mudah, asal tahu caranya.  Jawabannya adalah kita menggunakan kombinasi antara menu transition dan menu delay saat sebelum dan sesudah hover.

Berikut demonya untuk lebih jelasnya

Pada intinya pada mode normal, anak menu atau tag <ul> tingkat ke-2 di beri delay agar tidak langsung hilang.

    transition-delay: 2s;
    -o-transition-delay: 2s;
    -ms-transition-delay: 2s;
    -moz-transition-delay: 2s;
    -webkit-transition-delay: 2s;

Mudah bukan teman-teman cara membuatnya. Semoga bermanfaat, Salam Semangat yes!

13 Juni 2015

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