Se me ocurrió una forma demasiado complicada para resolver tu problema, pero como la probé y funciona , aquí va.
Para empezar, hice trampa y usé algo como "... un div o un bloque ...", que es un
iframe; y luego lo puse como destino de páginas con las imágenes de fondo y un
BlendTrans en la carga de cada una.
Como no estoy seguro de ser muy claro, te posteo las plantillas, para que las guardes en un mismo directorio y hagas los cambios necesarios para adaptarlas a tu página. (tienen algunos "
bugs", como que el fondo se desplaza con el texto y que las imágenes no son aleatóreas sino relacionadas con el enlace, pero eso se puede arreglar - ... creo - ).
Código:
----BGconIFRAME.html----
<html>
<body topmargin=0 leftmargin=0>
<iframe src="BG0.html" scrolling=no name=fondo style="position:absolute; z-index:-10;
width:100%;height:100%;" > </iframe>
<center>
<h1 onmousedown=window.open('BG0.html','fondo','');
style="color:blue; cursor:hand">
Enlace cero
</h1>
<h1 onmousedown=window.open('BG1.html','fondo',''); style="color:blue; cursor:hand">
Enlace uno
</h1>
<h1 onmousedown=window.open('BG2.html','fondo',''); style="color:blue; cursor:hand">
Enlace dos
</h1>
<h2>
Debes agregar un evento <tt>onclick</tt> a cada "enlace", ya que éstos no van a ninguna
parte; sólo activan el cambio de fondo en un <tt><iframe></tt>
con posición absoluta.
</h2>
</center>
</body>
</html>
Código:
---BG0.html---
<html>
<head>
<META http-equiv="Page-Enter"
content="BlendTrans(duration=6)">
</head>
<body leftmargin=0 topmargin=0>
<img src="IMAGEN_1.jpg" width=100%>
</body>
</html>
y
BG2 son iguales a
BG0, con distintas imágenes.