Função mouseover e mouseout
Olá. Sou designer gráfico e iniciante em web. Estou reformulando meu site e não acerto fazer a mudança das miniaturas de trabalhos recentes em preto e branco pra colorido em todas as imagens. Cada miniatura será linkada pra uma parte diferente. Acerto fazer isso só em uma mas quando tento aplicar nas 5 imagens não dá certo. Acredito que seja algo no código inserido no header, vejam como está: imagetica.net/index_4
Assim está o javascript no HEAD
<head>
<script language="Javascript">
function lightUp()
{
document.images["trab1"].src="Layer-11_cor.png"; document.images["trab2"].src="Layer-10_cor.png"
}
function dimDown()
{
document.images["trab1"].src="Layer-11.png"; document.images["trab2"].src="Layer-10.png"
}
</script>
</head>
Acho que o problema está em eu não saber inserir os valores ou dados pra outras imagens.
Assim está inserido no BODY
<div id="Layer-11" ><a href="/portfolio_iv" onmouseOver="lightUp();" onmouseOut="dimDown();">
<img src="Layer-11.png" name="trab1" width=70 height=70 border=0> </a></div>
<!-- This is 'trab2' -->
<div id="Layer-10" ><a href="/portfolio_iv" onmouseOver="lightUp();" onmouseOut="dimDown();">
<img src="Layer-10.png" name="trab2" width=70 height=70 border=0> </a></div>
O rimeiro funciona bem mas interfere no segundo, os demais ainda não modifiquei o original pra tb terem a função de mouseover.
<!-- This is 'trab3' -->
<div id="Layer-9" > <img src="Layer-9.png" width="70" height="70" alt="trab3" /></div>
<!-- This is 'trab4' -->
<div id="Layer-8" > <img src="Layer-8.png" width="70" height="70" alt="trab4" /></div>
<!-- This is 'trab6' -->
<div id="Layer-7" > <img src="Layer-7.png" width="70" height="70" alt="trab6" /></div>
Qualquer ajuda será muito bem vinda pra um iniciante como eu! Obrigado antecipadamente.
Discussão (6)
Carregando comentários...