[tarkasha]

Здравствуйте. Я новичок. Делаю игру. Создал функцию, которая делает из фото анимацию, с помощью подмены классов css. Функция прекрасно работает с одним объектом, но если добавить 2 или более, то происходит хаос. Подозреваю что проблема в интервале, так как он для каждого объекта называется одинаково. Но не представляю как его сделать динамичнее. Вот скрипт:

Вызов скрипта

spriteAnimation(n, 90, 8, false);

n - объект, 90 скорость 8 количество кадров, false - однократное воспроизведение.

// Анимация движения (перебор спрайтов)  
function spriteAnimation(n,s,z,r){
    var obj = document.getElementById(n.name);
    var i = 0;
   // var cls= n.name + '_Run_' + i;
if(s == 'STOP'){
    
    clearInterval(heroGo);
   
    for(i = 0; i <= z; i++){
        obj.classList.remove(n.name +'Run_' + i)
        console.log('z: '+z+' i: '+i);
    }
    
    i = 0;
    obj.classList.add(n.name + 'Run_' + i);

}else{
    
     heroGo = setInterval(function(){
        console.log(z);
        if ( i < (z + 1)){
            if(i != 0){i--;}
            obj.classList.remove(n.name +'Run_' + i);
            i++;
            obj.classList.add(n.name +'Run_' + i);
            i++;
            
        }else if( i == (z + 1)){
            i--;
            obj.classList.remove(n.name +'Run_' + i);
            i = 0;
            obj.classList.add(n.name +'Run_' + i);
            
            if(r == true){
                clearInterval(heroGo);
            }
        }
       
    }, s);
}
}

Буду рад любому совету.