برای مورد اول یه مثال دارم که البته فقط رو ie کار می کنه و برای کار با عکس باید یه کمی خودت تغییرش بدی:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<HTML>
<HEAD>
<TITLE>Test</TITLE>
</HEAD>
<script language="javascript">
function change(i){
document.all("d2").style.filter="alpha( ;opacity="+i+")";
i+=10;
if(i<100){setTimeout("change&# 40;"+i+")",200);}
else{
document.all("d2").style.zIndex=1;
}
}
</script>
<STYLE>
a{font-family:tahoma;font-size:12px;color:blue;}
</style>
<BODY>
<table id="d2" style="filter:alpha(opacity=10);" onmouseover="change(10)">
<tr><td>Move mouse over text! This is table but you can do this on images too!
</td></tr>
</table>
</BODY>
</HTML>
در مورد لود کردن عکس هم باید عکس رو پیش از نمایش لود کنی مثالش رو اگه پیدا کردم برات میفرستم