Fade de varias imagenes que tengan la misma clase

[mparraud]

Tengo 3 links. Quiero que cada uno afecte al pasar el mouse por encima a las imagenes que tengan la misma class.

Por ejemplo, tengo 9 imagenes y 2 con una class supongamos VERDE y las otras 4 con otra class ROJA. y 3 con la clase AZUL

lo que quiero hacer es que si hago rollover sobre el link que dice VERDE, este haga que todas las imagenes que NO tengan la clase VERDE, o sea que sean ROJO O AZUL hagan un fade de 100 a 30% de opacity.

Esto lo logré usando DIVs con ID y el SpryAsset de Dreamweaver, pero a la hora de modificar es medio chino.

Pueden ver el ejemplo en el siguiente link.
http://www.parraud.com.ar/fade/

[edwardd89]

Con jquery es muy sencillo

haces un evento de hover y le añades una clase de opacidad, te dejo un ejemplo que te he creado:

Código:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<style>
span
{
cursor:pointer;
}
.azul
{
height:100px;
width:100px;
background:blue;
}
.verde
{
height:100px;
width:100px;
background:green;
}
.rojo
{
height:100px;
width:100px;
background:red;
}
.opacidad
{
opacity:0.1;
}
</style>
<script>
$(document).ready(function(){
	$('span').hover(function(){
		$('div:not(.'+$(this).text()+')').addClass("opacidad");
	},function(){
		$('div').removeClass("opacidad");
	});
})
</script>
<div class="azul"></div>
<div class="verde"></div>
<div class="rojo"></div>

<span>rojo</span>
<span>verde</span>
<span>azul</span>

es fundamental añadir la libreria jquery, tenemos 3 clases y una de opacidad,
cuando nos ponemos encima del div ponemos a todos los que no tienen la clase del span la clase opacidad y cuando te sales del hover le kitamos a todos los div la clase.

espero que te sirva.
un saludo!

[IsaBelM]

se puede hacer con css3. sólo has de cambiar el orden, primero los vínculos y después las imágenes. a partir de aquí con selector de hijos y selector general de hermanos accedes a los elementos que quieres cambiar. cambias la opacidad

[edwardd89]

si, pero con efecto fade?..

[IsaBelM]

te suena la propiedad transition??

[edwardd89]

no la conocía, gracias! xd