動漫形象問題點擊一個按鈕

，當我有這樣的代碼：動漫形象問題點擊一個按鈕

function CreateAndAnimateEnemyImg() { 
    var nh = Math.floor(Math.random() * w + 30); 
    var enemy = document.createElement('img'); 
    enemy.src = 'enemy.jpg'; 
    enemy.className = 'Enemy'; 
    pane.append(enemy); 
    enemy.onload = function() { 
    enemy.style.top = nh + 'px'; 
    } 
} 

$("#Start").click(function() { 
    var x = setInterval(function() { 
    CreateAndAnimateEnemyImg(); 
    $('.Enemy').animate({ 'left': '-=20px' }); 
    time--; 
    }, 20); 

    if (time == 0) { 
    timeElapsed = true; 
    clearInterval(x); 
    } 
});

這是jsfiddle

我知道我的邏輯是錯誤的，我想ü幫我解決我的問題點擊時應該創建一個新圖像，並且動畫和計數器應該在計數器設置爲0時初始化，應該停止創建新圖像，但創建的圖像應該仍然動畫到左側-20px

來源

2013-07-20 Sora

修改了開始點擊處理程序的一點點。敵人動畫被移動到自己的計時器，並在創建新的敵人間隔添加檢查，看看創建時間達到最大。

這裏是新的代碼，更新fiddle demo

$("#Start").click(function() { 
    intervalPoint = setInterval(function() { 
    CreateAndAnimateEnemyImg(); 
    time--; 
    if (time == 0) 
    StopTimer(); 
    }, 20); 

    setInterval(function() { 
    $('.Enemy').animate({ 'left': '-=20px' }); 
    }, 20); 

}); 

function StopTimer(){ 
    timeElapsed = true; 
    clearInterval(intervalPoint); 
    time = 3; 
}

來源

2013-07-20 12:19:09 Vasanth

我已經改變了明確的時間間隔的位置和阿迪一些條件檢查這裏

if (time > 0) { 
$('.Enemy').animate({ 'left': '-=20px' }); 
time--; 
console.log(time); 
if(time == 0){ 
    timeElapsed = true; 
    clearInterval(x); 
} 
}

檢查Fiddle

來源

2013-07-20 12:19:57

動漫形象問題點擊一個按鈕

回答

相關問題