hover em um elemento

[digoshirota 0]

Tenho o seguinte codigo:

 

<div>

<a id="menu">menu</a>

</div>

<div>

<div>....

</div>

<div>....

</div>

<div id="conteudo" </div>

 

 

gostaria de dar hover no elemento id="menu" e fazer aparecer o elemento id="conteudo".

Como eu faço isso? estou tentando usar o css abaixo preciso da ajuda pra usar os seletores certo!

 

 

#conteudo{

display: block;

visibility: hidden;

opacity: 0;

height: 0;

overflow: hidden;

transition-property: opacity;

transition-duration: .25s;

transition-delay: .25s;

-webkit-transition-property: opacity;

-webkit-transition-duration: .25s;

-webkit-transition-delay: .25s;

}

 

#menu:hover{

opacity: 1;

visibility: visible;

height: auto;

color: #777;

}

 

agradeço a ajuda!

[William Bruno 1501]

Para isso vc precisa de javascript

[digoshirota 0]

Obrigado!