Opacidade em imagens

[racha_cuca 0]

Caros, boa tarde !!

 

Já faz algum tempo q não posto por aki, porém estou sempre acompanhando, inclusive fiz uma busca pra saber se a minha dúvida poderia ser respondia, mas não foi ... acho q eh pq eu quero entender oq fiz d errado. Bem vamos lá:

 

 

Tenho duas imagens no site:

 

<div id="generalOptions">
  <a href="#"><img onmouseover="opacidadeImg(100);" onmouseout="opacidadeImg(30);" src="imagens/analista/control_panel.png" alt="Configurações Gerais" /></a>
  <a href="#"><img onmouseover="opacidadeImg(100);" onmouseout="opacidadeImg(30);" src="imagens/analista/logout.png" alt="sair" /></a>
</div>

 

Notem que tais imagens chamam uma função que eu dei o nome de opacidadeImg e passo um parâmetro, que é o valor que eu quero de opacidade na imagem.

 

No Javascript, crio uma variável chamada opacidade e nela recupero todas as tags img que existem, neste caso serão duas. Crio um pequeno loop que rodará até que o número de tags acabe e também crio uma condição pra saber qual o navegador usado. Para aplicar a opacidade na tag especifica, informo o valor do array populado na variável opacidade como x (pegará o valor definido no início do loop). Abaixo o código:

 

function opacidadeImg(valorOpacidade) {
	
	var opacidade = document.getElementsByTagName('img');
	for (var x = 0; x < opacidade.length; x++) {
		if (navigator.appName == 'Microsoft Internet Explorer') {
			opacidade[x].filters.alpha.opacity = valorOpacidade;
		}else{
			opacidade[x].style.MozOpacity = valorOpacidade/100;
		}
	}
}

 

O problema é que ao aplicar tudo isso no site, quando passo o mouse sobre uma das imagens, ele cria o efeito nas duas e sinceramente, não tenho a mínima do porque. Alguém tem idéia do pq ?

[Otata 4]

ele faz isso pq nesse seu loop ela passa em todas e aplica para todas.. o ideal seria você fazer uma funcão que apenas mude individualmente.. nao uma para cada mas um func que pegue o elmento e mude o opacity dela...

 

algo como

 

function opacidadeImg(elemento,valorOpacidade) {

		if (navigator.appName == 'Microsoft Internet Explorer') {
			elemento.filters.alpha.opacity = valorOpacidade;
		}else{
			elemento.style.MozOpacity = valorOpacidade/100;
		}
}
 <a href="#"><img onmouseover="opacidadeImg(this,100);" onmouseout="opacidadeImg(30);" src="imagens/analista/control_panel.png" alt="Configurações Gerais" /></a>