Passar o mouse sobre
<a href="http://www.dicasparablogs.com.br/p/lista-de-tutoriais.html"
onmouseover="this.innerHTML = 'tutoriais diversos'"
onmouseout="this.innerHTML = 'posts aleatórios'">posts aleatórios</a>
Veja aqui o exemplo:
posts aleatórios
A finalidade deste código é trocar o texto quando o mouse está sobre ele. O funcionamento é bem simples e fácil de alterar. Você deve colocar a url da pagina que desejar e escolher o texto que aparecerá. Um detalhe que não pode ser esquecido é repetir duas vezes o texto normal (aquele que aparece quando não estava com o mouse sobre ele) no exemplo Meu Jornal, pois se colocar apenas uma vez quando passar o mouse sobre ele o texto mudará mas não voltará ao original quando tirar o mouse.
Outro cuidado que precisamos ter é usar textos com numero parecido de letras pois se o texto que aparece quando o mouse não está sobre ele tiver 10 letras e quando passar o mouse aparecer um texto de 20 letras talvez não tenha espaço na mesma linha então o texto ocupará duas linhas e isto faz todo o layout do blog dar um “pulo”, ou seja quando aparece o texto maior e passa a ocupar duas linhas tudo que estiver abaixo dele vai descer um pouco para dar espaço. Então tenha cuidado de verificar se quando passa o mouse o texto continua ocupando o mesmo numero de linhas.
Se quiser pode fazer algo parecido com imagens, veja aqui como fazer para trocar a imagem quando passa o mouse em cima dela.
onmouseover="this.innerHTML = 'tutoriais diversos'"
onmouseout="this.innerHTML = 'posts aleatórios'">posts aleatórios</a>
Veja aqui o exemplo:
posts aleatórios
A finalidade deste código é trocar o texto quando o mouse está sobre ele. O funcionamento é bem simples e fácil de alterar. Você deve colocar a url da pagina que desejar e escolher o texto que aparecerá. Um detalhe que não pode ser esquecido é repetir duas vezes o texto normal (aquele que aparece quando não estava com o mouse sobre ele) no exemplo Meu Jornal, pois se colocar apenas uma vez quando passar o mouse sobre ele o texto mudará mas não voltará ao original quando tirar o mouse.
Outro cuidado que precisamos ter é usar textos com numero parecido de letras pois se o texto que aparece quando o mouse não está sobre ele tiver 10 letras e quando passar o mouse aparecer um texto de 20 letras talvez não tenha espaço na mesma linha então o texto ocupará duas linhas e isto faz todo o layout do blog dar um “pulo”, ou seja quando aparece o texto maior e passa a ocupar duas linhas tudo que estiver abaixo dele vai descer um pouco para dar espaço. Então tenha cuidado de verificar se quando passa o mouse o texto continua ocupando o mesmo numero de linhas.
Se quiser pode fazer algo parecido com imagens, veja aqui como fazer para trocar a imagem quando passa o mouse em cima dela.
Marcadores: Acessórios, Efeitos