Masalah yang tampak kecil tapi kita harap bisa diperbaiki adalah
mengenai efek hover menu induk pada navigasi bertingkat yang akan
menghilang setelah pointer memasuki submenu:
Itu terjadi karena pada umumnya kita menargetkan efek hover pada elemen tautan saja seperti ini:
nav li a:hover {
background-color:blue;
}Padahal yang seharusnya kita targetkan adalah elemen list/daftar yang menjadi induk dari submenu, karena submenu berada di dalam elemen
<li>, bukan di dalam elemen <a>:
Sayangnya menargetkan elemen
<li> secara sepihak untuk mempertahankan warna menu induk tidak bisa kita lakukan karena efek hover berada pada elemen <a>, sehingga saat pointer keluar dari <a> maka efek hover akan menghilang. Tapi berbeda jika kita menargetkan elemen <li> kemudian memanfaatkan sikap hover pada elemen tersebut untuk mengeset warna direct children tautan di dalamnya:nav li a:hover,
nav li:hover > a {
background-color:blue;
}Dengan cara di atas maka warna pada menu induk akan tetap terjaga
meskipun pointer sudah meninggalkannya. Karena meskipun sudah keluar,
tapi pada dasarnya pointer masih berada di dalam elemen
<li> induk:
ajb@2013
.png)
