Ayuda con Slider de texto con efecto fade

  • Autor Autor jeffvv
  • Fecha de inicio Fecha de inicio
jeffvv

jeffvv

Delta
Domainer
Verificación en dos pasos activada
Buenas betas, tengo un slider de texto y le quiero agregar el efecto fade para que aparezca lentamente el texto.

La estructura de mi slide de texto es:
HTML:
<html>
<body onload="changeText();">
                <div>
                      <h1 id="textslide"></h1>
                </div>
</body>
    <script>
        var counter = 0;
        function changeText()
        {
        var quotes = new Array();
        quotes[0] = "Mensaje 1";
        quotes[1] = "Mensaje 2";
        quotes[2] = "Mensaje 3";

        if (counter > 2)
            {
            counter = 0;
            }
        document.getElementById("textslide").innerHTML = quotes[counter];
        setTimeout(function(){changeText()},6000);
        counter ++;
        }
    </script>
</html>

Y he encontrado estas 2 formas de agregarle el efecto fade pero no se como implementarlo.

Edit fiddle - JSFiddle
Edit fiddle - JSFiddle

Me pueden ayudar a implementarlo con mi slider?

Gracias de antemano.

PD: No quiero cambiar la forma de hacer el slide ya que es la unica que funciono con mi landing page, las otras que probe me movian las imagenes y posiciones.
 
Pues.. ves que te genera dos cuadros de código.. El del lado derecho debes agregarlo en las lineas de tu código.. el de la derecha debes integrarlo a tu codigo css, este se encargara de darle la apariencia de "desvanecimiento".
 

Temas similares

Atrás
Arriba