Quiero fotos transparentes

[tyrantyan]

Hola buenas noches,
El tema es que funciona bastante bien lo que hice con las fotos que utilizo en mi página:

www.vab-consulting.net

Me refiero a las de los iconos sociales, pero y siempre aparece el famoso pero. Sucede que las fotos se cargan tal como son y yo quiero que ya se carguen casi transparentes, para luego si pasar el Mouse y se vean tal como son (además de lograr el efecto de una página no tan cargada).
El código que utilizo es este:

<img src="images/index/png/YOUTUBE.png" alt="" width="170" height="90" style="-moz-opacity:0.5;filter:alpha(opacity=50);cursor:hand"
onmouseover="this.style.MozOpacity=1;this.filters. alpha.opacity=100"
onmouseout="this.style.MozOpacity=0.2;this.filters .alpha.opacity=50" />

Que debo agregar o cambiar para lograr el efecto deseado?
Gracias de antemano!

[Zoidberglangosta]

Divs + CSS es mucho mas fácil, ahora busco un diseño que tengo echo y lo pego.


HTML

<div id="social"> Las imagenes que quieras y su link <div>

CSS

#social img {
filter:alpha(opacity=70);
-moz-opacity:0.7;
-khtml-opacity: 0.7;
opacity: 0.7;
}
#social img:hover {
filter:alpha(opacity=100);
-moz-opacity:1;
-khtml-opacity: 1;
opacity: 1;

}

[tyrantyan]

Okey, perfecto y gracias. Sucede que hay una foto que es la primera (img src="images/index/png/Conectate.png" alt="" width="170" height="90"/>) que no quiero que tenga ningún efecto y que siga permaneciendo en el mismo lugar, sino que se vea tal cual es:
El código me quedo así:

<div id="social">
<div class="left"> <img src="images/index/png/Conectate.png" alt="" width="170" height="90"/><img src="images/index/png/YOUTUBE.png" alt="" width="170" height="90"/><img src="images/index/png/facebook.png" alt="" width="170" height="90"/><img src="images/index/png/twiiter.png" alt="" width="170" height="90"/><img src="images/index/png/rss.png" alt="" width="170" height="90"/><img src="images/index/png/flickr.png" alt="" width="170" height="90"/><br/> </div>

Que tengo que hacer… soy un bruto para estas cosas…

[Zoidberglangosta]

haz 2 divs, en el primero pon la imagen que no quieres que transparente, en el segundo las otras. El CSS te tendría que quedar así:

#div1 {

float:left;


}
#div2 {

float;right;
opacity...

}