Conosco solo sommariamente le librerie JQuery etc., ma fortunatamente lucavizzi ti ha già risposto.

In puro Javascript, ti mostro un uso del this con un esempio che già traccerebbe la via per fare quello che ti occorre ma appunto, in puro Javascript:
codice:
<script>
function transform(element){
element.style.opacity="0.4";
}

function repristinate(element){
element.style.opacity="";
}
</script>
<body bgcolor="#6f6">
<img onmouseout="repristinate(this)" onmouseover="transform(this)" src="http://admiral-kolchak.narod.ru/index.files/image786.jpg">
<img onmouseout="repristinate(this)" onmouseover="transform(this)" src="http://admiral-kolchak.narod.ru/index.files/image3791.jpg"><img 
onmouseout="repristinate(this)" onmouseover="transform(this)" src="http://admiral-kolchak.narod.ru/index.files/image1149.jpg">
</body>
Per svilupparlo, bisognerebbe ampliarlo con proprietà di stile "parallele" a style.opacity che non tutti i browser riconoscono.
E poi ovviamente, aggiungere una temporizzazione per l' effetto di animazione.

Poi vedi una "vecchia" cosa di HTML:
Tag IMG in-linea nel codice, lasciano uno spazio come carattere di testo se si va a capo così nel codice:
codice:
<img src="">
<img src="">
e allora se occorreva evitarlo, si andava a capo così:
codice:
<img src=""><img 
src="">