vianeth pichica muñoz: Este ejemplo contempla un mostrador de diapositivas (en este caso imágenes). Se tienen dos enlaces, uno mostrar la diapositiva siguiente y otro para mostrar la diapositiva anterior. Una posible aplicación práctica podría ser en una galería de fotos.

<html>
<head>
<title>Ejemplo de un mostrador de diapositivas</title>
<script>
var contador = 0;
var diapositivas = [];
function inicio()
{
        var contenedor = document.getElementById("diapositivas");
        while (contenedor.childNodes.length > 0)
        {
             if (contenedor.getElementsByTagName("img")[0]==contenedor.firstChild)
             {
                 diapositivas[diapositivas.length] = contenedor.removeChild( contenedor .firstChild);
            }
            else contenedor.removeChild(contenedor.firstChild);
        }
}
function adelante()
{
        contador++;
        if (contador >= diapositivas.length) contador = 0;
        ponerImagen()
}
function atras()
{
        contador--;
        if (contador < 0 ) contador = diapositivas.length - 1;
        ponerImagen();
}
function ponerImagen()
{
        var contenedor = document.getElementById("diapositivas");
        if (contenedor.childNodes.length==0)
        contenedor.appendChild(diapositivas[contador]);
        else contenedor.replaceChild(diapositivas[contador], contenedor.childNodes[0]);
}
</script>
</head>
<body>
<a href="javascript: atras();">Atrás</a>
<span id="diapositivas">
<img src="arx1299975097t.gif" alt="Diapositiva 1" height="100" width="200">
<img src="bwy1296591260p.gif" alt="Diapositiva 2" height="100" width="200">
<img src="images.jpg" alt="Diapositiva 3" height="100" width="200">
</span>
<a href="javascript: adelante();">Adelante </a>
</body>
</html>
<script>
inicio();
ponerImagen();
</script>

vianeth pichica muñoz

lunes, 19 de septiembre de 2011

Este ejemplo contempla un mostrador de diapositivas (en este caso imágenes). Se tienen dos enlaces, uno mostrar la diapositiva siguiente y otro para mostrar la diapositiva anterior. Una posible aplicación práctica podría ser en una galería de fotos.

No hay comentarios:

Publicar un comentario