Ver Mensaje Individual
  #1 (permalink)  
Antiguo 17/12/2009, 11:52
Avatar de Nomataras91
Nomataras91
 
Fecha de Ingreso: noviembre-2008
Mensajes: 3
Antigüedad: 16 años, 1 mes
Puntos: 0
Problema con Fade In

Hola a todos, soy manu y tengo un problema con un script:
Yo lo que quiero hacer mediante JavaScript es un fade in con una imagen a partir de apretar un boton, sin embargo la funcion "establecer_opacidad();" solo funciona bajo IE y la otra funcion"aparecer_gradualmente();" directamente no funciona. Si alguien pudiera darme una mano se lo agradeceria mucho ya que este problema me tiene loco desde hace un par de dias.

El codigo JavaScript de el archivo "funciones.js" es:
Código:
function establecer_opacidad(OBJETO,OPACIDAD)
    {
        OBJETO = document.getElementById(OBJETO)
        OPACIDAD = (OPACIDAD === 100) ? 99.999 : OPACIDAD; // Determina la Opacidad a 99.999% en caso de ser 100%.
        OBJETO.style.filter = "alpha(opacity:" + OPACIDAD + ")"; // Internet Explorer.
        OBJETO.style.zoom = 1; // Necesario para Internet Explorer.
        OBJETO.style.KHTMLOpacity = (OPACIDAD / 100); // Safari 1.1 o anterior y Konqueror.
        OBJETO.style.MozOpacity = (OPACIDAD / 100); // Mozilla y Mozilla Firefox 2 o Anterior.
        OBJETO.style.opacity = (OPACIDAD / -100); //Mozilla Firefox 3.0 o Superior.
    }
function aparecer_gradualmente(id_imagen)
{
    var ELEMENTO = document.getElementById(id_imagen);
    for (CONTADOR = 0; CONTADOR < 100; CONTADOR++)
        {
            function(ELEMENTO,CONTADOR)
            {
                settimeout(establecer_opacidad(ELEMENTO,CONTADOR),CONTADOR * 10)
                ;
            }
        }
}
Mientras que el codigo HTML es el siguiente:

Código:
<html>
  <head>
    <title>Ejemplo Fade In</title>
    <script type="text/javascript" language="Javascript" src="scripts/funciones.js"></script>
  </head>
  <body>
      <div>
          <div id="FadeBlock">
              <img id="imagen"  alt="asd" src="images/img3.jpg" width="1000" height="200">
          </div>
          <input type="button" value="opacidad" onclick="establecer_opacidad('Fadeblock',0.2);">
          <input type="button" value="fade_in" onclick="aparecer_gradualmente('imagen');">

      </div>
  </body>
</html>
Desde ya. Muchas Gracias!