Transición entre dos imágenes

¿Está aburrido de los efectos tradicionales del ratón? ¿Por qué no utiliza las propiedades de transición de Internet Explorer para crear un magnífico efecto de desvanecimiento entre dos imágenes?

Haga clic en la imagen para ver un ejemplo:



Para obtener el efecto, inserte este script en el encabezamiento de su página:

<script language="JavaScript">
var fRunning = 0
function startTrans()
{
if (fRunning == 0)
{
  fRunning = 1
  imageid.filters.blendTrans.Apply();
  imageid.src = "picture2.gif";
  imageid.filters.blendTrans.Play()
}
}
</script>
<script for="my_picture" event="onfilterchange">
fRunning = 0
</script>

Inserte el siguiente código donde quiera que aparezca la imagen, entre las etiquetas <body> y </body>:

<img id="imageid" src="picture1.gif" style="filter:blendTrans(duration=3)" onclick="startTrans()" WIDTH="100" HEIGHT="102">

Personalice simplemente este script de acuerdo con las imágenes que desea utilizar y el tiempo de transición:

  • picture1.gif corresponde a la imagen predeterminada visualizada en la página

  • picture2.gif corresponde a la imagen visualizada en un desvanecimiento cuando el visitante hace clic.

  • duration=3 corresponde al tiempo de transición.