entre Desarrolladores

Recibe ayuda de expertos

Registrate y pregunta

Es gratis y fácil

Recibe respuestas

Respuestas, votos y comentarios

Vota y selecciona respuestas

Recibe puntos, vota y da la solución

Pregunta

1voto

cargar imagenes singularmente despues de algunos segundos

hola chicos tengo una lista de imagenes me gustaria poder cargar cada una dinamicamente, es decir que cada imagen se cargue despues de algunos segundos hasta que se carguen todas las imagenes
practicamente se deberia de crear el elemento imagen y llevar la primera imagen de mi lista, luego despues de algunos segundos se deberia de crear otro elemento y llevar el siguiente elemento de mi lista, esto se debe detener cuando llege al ultimo elemento para no crear un bucle infinito


<button onclick="listar()">listar todas las imagenes</button>
<div id="seccion"></div>

<script type="text/javascript">
var files =['enero.jpg', 'febrero.jpg', 'marzo.jpg', 'abril.jpg', 'mayo.jpg'];
function listar(){
    contador = 0;
    contenedor = document.getElementById('seccion');
    imagenes = document.createElement('img')
    loop = setInterval(function(){
        contador = contador + 1;
        contenedor.appendChild('imagenes');
        rutaImagen = imagenes.setAttribute('src', 'clothes/'+files[contador]);
        rutaImagen.height= 100;

    }, 5000);
}

output

orden.html:36 Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.

1 Respuesta

1voto

Leonardo-Tadei Puntos207780

Hola @steven,

tenés otra vez un problema de sintaxis. El método appendChild() tiene que recibir cómo parámetro una variable (que contiene la salida del createElement() ) y no un string como estás haciendo.

En Javascript y en la mayoría de los lenguajes de programación 'imagenes' o imagenes son cosas distintas.

Luego, si tu elemento creado está en la variable imagenes, el height también aplicáselo a esa variable y no a rutaImagen.

Saludos cordiales.

steven comentado Abr 9

ahora si me muestra las imagenes pero una remplaza la otra y lo que yo quiero es que se cargen todas juntas una por una hasta hasta crear multiples elementos img

function listar(){
    contador = 0;
    contenedor = document.getElementById('seccion');
    elemento = document.createElement('img');
    loop = setInterval(function(){
        contador = contador + 1;
        contenedor.appendChild(elemento);
        rutaImagen = elemento.setAttribute('src', 'clothes/'+files[contador]);

    }, 5000);
}

magarzon comentado Abr 9

La variable elemento referencia siempre al mismo nodo, que estás anexando (appendChild) x veces al nodo sección, por eso cuando cambias el atributo src, se lo estás cambiando al mismo elemento, siempre. Debes meter la creación del elemento dentro de la función del intervalo.

steven comentado Abr 9

si me di cuenta despues de hacer varios controles a mi codigo

Por favor, accede o regístrate para responder a esta pregunta.

¿Conoces alguien que puede responder?
¡Comparte esta pregunta!


Actividad Reciente

¿Eres Usuario Apple?

...

Bienvenido a entre Desarrolladores, donde puedes realizar preguntas y recibir respuestas de otros miembros de la comunidad.

Conecta