Estoy armando una superposición personal para mi transmisión, usando sockets NodeJS y una página web simple, y tiene, para cada mensaje de chat, el pequeño personaje del jugador que se ejecuta en la parte inferior de la pantalla. Hasta ahora, esto ha funcionado muy bien, pero estaba tratando de configurar esto para que el mismo personaje se reproduzca varias veces, principalmente por diversión. El problema que encontré es que al establecer un nuevo intervalo, el anterior se detiene y el personaje se congela en su lugar. Espero poder hacer que esto funcione y espero que haya ayuda disponible con una revisión. :)
aquí está el código
function animPlayer(name){ $.get(`/images/players/${name}strip.png`).done(function() { //clearInterval(tID); var tID; var rID; document.getElementById("playercontain").innerHTML += `<p id="image" class='${name}'> </p>`; var elemy = document.getElementsByClassName(name); var elem = elemy[elemy.length - 1]; var position = 69; var rposition = -100; const interval = 150; elem.style.backgroundImage = `url('/images/players/${name}strip.png')`; elem.style.right = '-100px'; rID = setInterval (() => { elem.style.right = `${rposition}px`; if(rposition < 2080){ rposition += 4; } else { elem.remove(); clearInterval(rID); } }, 2); setTimeout(() => { elem.style.right = '-100px'; }, 4000); tID = setInterval (() => { elem.style.backgroundPosition = `-${position}px 0px`; if (position < 138) { position = position + 69; } else { position = 0; } }, interval); }).fail(function() { console.log('it busy'); }) }Como explicación, el código verifica la existencia de la imagen de tira de sprites del jugador y, si existe, agrega la imagen a la página, luego la anima a través de un intervalo JSFiddle, y la dispara a través de la pantalla con un estilo simple. asignación correcta, pero como se dijo antes, cuando el jugador vuelve a chatear, el original se congela en su lugar. Podría hacer que verifique la existencia de la imagen y restablezca la posición, pero personalmente me gustaría tener varios corriendo a la vez. Por favor ayúdame, gracias. <3