animation - JavaScript for loop and print like animation (Canvas)

Question

コードについて質問があります。それは本当に奇妙に機能しています....なぜこれが起こるのかわかりませんが、説明させてください。（私の英語は下手ですが、何が起こっているのかを説明し、皆さんに良いイメージを与えるために最善を尽くします）

var spaceshipIncoming = document.createElement('audio');
var canvasMS12Main = document.getElementById('canvasMS12Main');
var imgMainMs12 = canvasMS12Main.getContext('2d');
var mainMs12 = new Image();
var number2 = 5;
var formatImage = ".png";
var stopeIncreaseMS12 = false;


function introMenu(){ //509,734,306,345
        imgMain.drawImage(mainImg, 6, 8, gameWidth, gameHeight, 0, 0, gameWidth, gameHeight);
        audioElement.setAttribute('src', 'soma.mp3');
        audioElement.play();          
}

function ms12AniAndSound(){
        setTimeout("introMS12()",5000);
        spaceshipIncoming.setAttribute('src', 'spaceshipIncoming.mp3');
        spaceshipIncoming.play();
}
function introMS12(){//78
    if(number2 < 78){
        number2 = number2 + 1;
    }else if (number2 == 78){
        stopeIncreaseMS12 = true;
    }
    var num = new Number(number2);
    mainMs12.src = 'ms12IntroAnimation/introMS12-' + num + formatImage;
    clearMainMS12();

    imgMainMs12.drawImage(mainMs12, 0, 0, gameWidth, gameHeight, 0, 0, gameWidth, gameHeight); 
    delayMS12();
}

function delayMS12(){
    if(stopeIncreaseMS12 == false){
    setTimeout("introMS12()",25);
    }else if(stopeIncreaseMS12 == true){
        clearMainMS12();
    }

}

function clearMainMS12(){
    imgMainMs12.clearRect(0, 0, 800, 500);
}

アニメーション画像を含むフォルダーがあり、各 PNG ファイルには introMS12-# のような名前が付けられています。各 # は 6 から 78 で始まります (したがって、基本的には introMS12-6.png、introMS12-7.png、introMS12-8.png.....introMS12-78.png のようになります)

Web ページを最初に読み込んだとき、アニメーションは表示されませんが、キャンバスで mp3 サウンドのみが再生されます。ただし、更新するかF5を押すとアニメーションが再生されます...更新してもアニメーションが再生されない場合があります。ただし、Chrome Web ブラウザーを閉じて再起動し、更新ボタンを押すと、アニメーションの再生が開始されます..... (ランダムに動作します....)

私はこれを10時間以上機能させようとしています...しかし、コードの何が問題なのかわかりません...助けてください! ありがとう。