[Resolvido] onMouseOver e onMouseOut problemas.

[Reanto 0]

Boa Noite Pessoal.

 

Desenvolvi um código javascript para ocultar e exibir divs qdo o mouse passar por cima. No IE funciona perfentamento e no FireFox não funciona nem a pau! Alguém sabe o que pode ser?

 

Javascript:

<script type="text/javascript">
function showfoto1()
{
	foto1.style.visibility="visible";
	foto2.style.visibility="hidden";
	foto3.style.visibility="hidden";
	foto4.style.visibility="hidden";
}
function showfoto2()
{
	foto1.style.visibility="hidden";
	foto2.style.visibility="visible";
	foto3.style.visibility="hidden";
	foto4.style.visibility="hidden";
}
function showfoto3()
{
	foto1.style.visibility="hidden";
	foto2.style.visibility="hidden";
	foto3.style.visibility="visible";
	foto4.style.visibility="hidden";
}
function showfoto4()
{
	foto1.style.visibility="hidden";
	foto2.style.visibility="hidden";
	foto3.style.visibility="hidden";
	foto4.style.visibility="visible";
}
function sometudo()
{
	foto1.style.visibility="hidden";
	foto2.style.visibility="hidden";
	foto3.style.visibility="hidden";
	foto4.style.visibility="hidden";
}
</script>

 

HTML

 

<img src="images/novopalio.JPG"  onMouseOver="showfoto1()" onMouseOut="sometudo()" class="fotoimg" />
        <img src="images/palio.jpg"  onMouseOver="showfoto2()" onMouseOut="sometudo()" class="fotoimg"/>
        <img src="images/weekend01.jpg"  onMouseOver="showfoto3()" onMouseOut="sometudo()" class="fotoimg" />
        <img src="images/ranger01.jpg"  onMouseOver="showfoto4()" onMouseOut="sometudo()" class="fotoimg" />
        
        <div id="foto1"><img src="images/novopalio.JPG" class="showimg"  /></div>
        <div id="foto2"><img src="images/palio.jpg" class="showimg"/></div>
        <div id="foto3"><img src="images/weekend01.jpg" class="showimg"  /></div>
        <div id="foto4"><img src="images/ranger01.jpg" class="showimg"  /></div>

 

Abraço pessoal...

[Thiago Retondar 18]

Você pode usar getElementById() ou assim:

 

function sometudo(elem)
{
        elem.style.visibility="hidden";
        elem.style.visibility="hidden";
        elem.style.visibility="hidden";
        elem.style.visibility="hidden";
}

E chamar assim:

 

<img src="images/novopalio.JPG"  onmouseover="showfoto1(this)" onmouseout="sometudo()" class="fotoimg" />

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[Reanto 0]

Então, sou novo na linguagem Javascript to aprendendo.

 

Não consegui usar o que você me recomendou!

 

Na versão do código que eu fiz, abri o console de javascript do Firefox e acusa um erro:

 

"foto1 is not defined"

 

Onde está indefinido? No IE funciona...

 

Em todas linhas que tenham "foto1.style.visibility"

 

O que sera que pode ser?

 

 

Abraços...

[Thiago Retondar 18]

Por que você não definiu foto1.

 

O que é foto1? Ahh é um id? Então pegue-o pelo getElementById():

 

document.getElementById('foto1').style.visibility

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[Reanto 0]

Agora ficou show de bola....muito obrigado!

 

 

Abraços e um ótimo final de semana...

[Thiago Retondar 18]

Igualmente. :)

 

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif