Se já viu botão num site que muda forma quando cursor passa por cima, provavelmente viu efeito "Mouseover" com JavaScript. JavaScript, não confundir com Java, é linguagem script simples para páginas Web. Capacidade de armazenar/recuperar variáveis permite efeitos únicos quando rato passa por item, incluindo botões.
Mais frequentemente, JavaScript é acionado definindo "OnMouseOver" numa tag link.
<a href="meusite.com" onmouseover="
Este atributo executa código JavaScript que escrever para botões ou identifica diretamente nova imagem. Como botões em páginas Web são ficheiros imagem pequenos, pode criar efeitos usando duas imagens: uma normal, outra para "Mouseover".
Hoje, muitos navegadores incluem código JavaScript necessário para integrar "OnMouseOver" e "OnMouseOut" (retorna ao estado original após rato sair), sem JavaScript adicional. Para isso, coloque document.[nomeitem].src=[localização] após atributos "...over" e "...out". "[nomeitem]" substitui valor do atributo ID na tag imagem que quer rollover. Ex: document.mine.src="minhaimagem2.jpg" correlaciona com <img src=minhaimagem.jpg id=mine>. "localização" é diretório onde ficheiro MouseOver/MouseOut está. Se mesma diretoria do HTML, só nome ficheiro chega.
Este código torna-se pesado se desejar muitos efeitos rollover. Para simplificar, escreva função JavaScript e chame-a com variável número/string. Coloque JavaScript no header do HTML dentro de tags <script>. A function 'nome'() – onde 'nome' é nome único – pode ser chamada nos atributos OnMouseOver/OnMouseOut da tag <A>. Ex: <A HREF="pagina.html" onmouseover="MeuOver()" onmouseout="MeuOut()">. Se usar variáveis, script procura automaticamente imagem e correspondente MouseOver. Ex: script procura "[variavel]_on.jpg" no OnMouseOver e "[variavel]_off.jpg" no OnMouseOff. Tag só chama onmouseover='meuout([variavel])'. Imagens associadas devem chamar-se "[variavel]_on.jpg" e "[variavel]_off.jpg".
Rollovers dependem de como cria imagens para exibir botão. Efeitos comuns: botão original "brilha" ao passar rato. Efeitos antigos: botão em relevo parece pressionado. Usam várias imagens, criadas em software gráfico. Importante: todos ficheiros imagem têm dimensões exatas iguais, senão página distorce em cada rollover.
Tecnologia Eletrônica © [www.351231.com]
