Menu Drop Down com HTML5 e CSS3

[Kimo Gordinho 2]

Oi, bom dia.

Então... eu estou testando meus conhecimentos básicos de HTML5 e CSS3 e como teste eu peguei um site e estou tentando montar ele do zero, mas acho que vou ficar só com o menu mesmo, enfim.

O meu problema é que eu consegui fazer o menu drop down e eu queria que os itens do submenu dos itens do meu menu principal, demorassem para desaparecer quando eu tirasse o cursor do mouse de cima do item do menu principal. Exemplo:
O meu item "Editar Perfil" tem os seus seguintes subitens: "Resumo", "Configurações da Conta", "Look and Layout" e "Perfil no Fórum".

Eu quero que ao retirar o cursor do mouse de cima do item "Editar Perfil" do meu menu principal, em contrapartida os itens do meu submenu permaneçam aparecendo dentro de um limite de tempo, como por exemplo, três segundos.

[washalbano 54]

Olá!

Pode-se resolver com css usando opacity e transition-delay

Mas creio que com javascript ficará mais interessante

Afinal, se um usuário passar o mouse rapidamente sobre os menus, todos ficarão abertos por 3s???

[Kimo Gordinho 2]

10 horas atrás, washalbano disse:

Olá!

Pode-se resolver com css usando opacity e transition-delay

Mas creio que com javascript ficará mais interessante

Afinal, se um usuário passar o mouse rapidamente sobre os menus, todos ficarão abertos por 3s???

Oi ^^
Então, consegui resolver o problema já e era isso mesmo que você falou. No caso, eu só precisava trocar o display  por opacity e a transição funcionaria.
E no caso, só os submenus teriam um efeito de transição para desaparecer.

Mto obrigado pela atençao brow!

[gianp 3]

Exemplo:

 

.logo {
  background:url();
  width: ;
  height;
  transition: all 3s;
}

.logo:hover {
 backgrund-color: #00BFFF;
  transition: all 3s;
}