Eh già ...
Il fatto è che la dissolvenza si basa sulla gestione nello STYLE della proprietà OPACITY che puoi applicare agli Elementi; cioè, essendo l' immagine attribuita al BODY in definitiva, dovresti applicare l' opacità a questo col risultato che tutto il contenuto diventa semi-trasparente ... e per dispetto, tutto tranne l' immagine di sfondo.
PROVA !
codice:
<style type="text/css">
body {
 background-image: url(http://alectart.altervista.org/images/onthesun.jpg);
 opacity: 0.4;              /* questo per tutti o quasi */
 filter: alpha(opacity=40); /* questo per far contento IExplorer */
 }
</style>
Non possiamo avere una background-opacity: 0.4; da definire.

E stiamo ancora parlando di style "statico" attribuito a Elementi, non ancora di JavaScript che lo gestisce in modo "dinamico".
Perché ti voglio con ciò, far partire dal presupposto che se "la cosa" non si può fare in style "normale", tantomeno si potrà in JS che su questo dovrebbe agire (modificando Valori di OPACITY).


Esiste però la possibilità di un workaround che ti posto velocemente, nelle sue linee essenziali, così come l' ho buttato giù sul momento; prendilo come base di partenza e sopratutto, studiaci un po':
codice:
<html>
<head>

<style type="text/css">
body {
 margin: ; /* assegna 0px per avere il div-background senza bordino */
 }
</style>

</head>
<body bgcolor="">

<div id="backgrnd" style="width: 100%; height: 100%; opacity: 0.4; filter: alpha(opacity=40); 
                          background-image: url(http://alectart.altervista.org/images/onthesun.jpg);">
</div>

<div id="bodylike" style="position: absolute; top: 0px;">
 <h1>Enzaccio' s Page</h1>
</div>

</body>
</html>