Criar um efeito de Imagem Rollover (a imagem da mudança no mouseover)

Sorria, pois Jesus te ama O efeito Rollover é aquele em que uma imagem web muda de objeto (a própria swaps) ao passar o mouse para outro objeto web (chamados de sobreposições) e será revertida para a imagem original no mouse para fora. Capotamento as imagens são pré-carregados para dentro da página quando ele está carregando, o que garante que as rolagens são exibidas rapidamente. Os atributos onMouseOver e onmouseout da tag link são usados ​​para fazer este funcional.





Demonstração:  Posicione seu mouse sobre a imagem abaixo para ver o seu efeito rollover












Fazendo Rollover Efeito de Imagem






Você tem o seguinte código:





<A href = " URL ADDRESS "> <img src =" URL da Primeira Imagem VAI AQUI "onmouseover =" this.src = ' URL da Segunda Imagem VAI AQUI '"onmouseout=" this.src =' URL DA IMAGEM VAI Sagres AQUI "" /> </a>





Mudar os textos coloridos como segue:





1.  URL ENDEREÇO





Este é o endereço onde alguém será enviado quando clica na imagem.


Exemplo, o meu endereço de blog: http://www.k7informatica.com/





2. URL da primeira imagem VAI AQUI





Substitua o texto laranja (duas vezes) com o endereço URL da imagem que aparece antes de você passar o mouse sobre ele .





3.  URL da segunda imagem VAI AQUI


Substitua o texto no azul com a url da imagem que aparecerá quando o cursor passa sobre ele.





Agora você pode colar sua imagem dentro de um gadget blog, vai Disposição > clique em Adicionar um Gadget link (lado direito)> Select HTML / JavaScript na janela pop-up, em seguida, adicioná-lo à sua barra lateral.





Você também pode adicioná-lo dentro de seu post, indo para New Post> Alterne para a guia HTML e cole o código na caixa vazia.





É isso aí. Aproveite;)








Nenhum comentário:

Postar um comentário

Postagens mais visitadas