Javascript - dissolvere immagini in tutti i browser

ciao
vorrei fare uno script che mi mostra delle immagini e le cambia automaticamente, fino a quel punto ci sono riuscito, ma il problema è che io vorei che quando cambia la foto visualizzata non lo fa di scatto ma me le dossilve
per internet explorer ho trovato una soluzione, ma per gli altri browser non sono riuscito
questo è il mio codice:

<script type="text/javascript">
var c=0
function photoGallery()
{
if (c%4==0){
document.getElementById('photo').src = "images/pic1.jpg";
}
if (c%4==1){
document.getElementById('photo').src = "images/pic2.jpg";
}
if (c%4==2){
document.getElementById('photo').src = "images/pic3.jpg";
}
if (c%4==3){
document.getElementById('photo').src = "images/pic4.jpg";
}
c=c+1
setTimeout("photoGallery()",5000)
}
</script>

ci sono risucuto, cambiando l'opacità
allego il codice caso mai interessi a qualcuno

Per evitare problemi di compatibilità fra i browser, visto che stai iniziando a usare javascript ti consiglio vivamente di utilizzare una libreria, il tuo lavoro sarebbe stato semplicemente: $('#ilmiooggetto').hide('slow'); e ti avrebbe nasconsto l'immagine automaticamente lentamente

Buona fortuna per le librerie, a me all'inizio ne è servita molta