Alterar texto - Hover

[Diogo Ricci 0]

Boa tarde!

Preciso que mude o texto quando passo o mouse num elemento, já tentei algumas coisas mas sem sucesso! O exemplo é esse aqui: http://1stwebdesigne...demos/diamonds/

Seria uma agenda pra músico, com a data e quando passa o mouse aparece a cidade. Só preciso alterar essa parte mesmo, o resto já consegui!

Valeu!

[Handoncloud 13]

Para mudar o texto do elemento você pode mudar a propriedade `innerHTML` do elemento, que te permite colocar um texto com HTML também.

 

[Rafael R Silva 27]

Fala Diogo beleza?

Da para fazer isso usando apenas CSS.

 

Na estrutura da lista adicionei uma div com a class location, que por default ela está com display:none;

Com o :hover nos links com a classe diamond eu adiciono o display:none na div com classe text e dou visibilidade na div location!

<li>
<a href="http://www.1stwebdesigner.com/" target="_blank" class="diamond">
<div class="text">
   Shine Bright like a Diamond
</div>
<div class="location">
   Rio de janeiro
</div>
</a>
</li>

Segue o codigo de exemplo:

http://jsfiddle.net/rrsilva88/o7uyguv8/

 

 

Não esquece de pontuar minha resposta =)

 

Abraço!

[Handoncloud 13]

Como minha internet está ruím, meu código saiu quando fiz um edit na minha resposta, aqui está novamente. Mas recomendo fazer isso com CSS, a maneira de @Rafael é boa.

%