Javascript - 距離（以像素爲單位） - 決定

Question

我有一個簡單的javascript動畫，其中兩個牛仔（iamges）'種族'基於隨機區間數相互對方。

我無法找到如何做的是讓腳本決定誰是贏家，這意味着如果牛仔首先達到預先定義的距離，劇本將知道並將顯示提醒誰贏了。

這裏是一個屏幕截圖顯示的例子：

這是我的代碼至今：http://pastebin.com/Cmt4N8c9

能給我一些方向？

感謝， 布賴恩

Answer 1

在你move()功能，你應該這樣做

if (x >= dest_x) { 
    alert('player 1 won'); 
} else if (x2 >= dest_x2) { 
    alert('player 2 won'); 
} else { 
    ... continue the loop ... 
} 

你最有可能把那個背後

document.getElementById("cowboy").style.top = y+'px'; 
document.getElementById("cowboy").style.left = x+'px'; 

document.getElementById("cowboytwo").style.top = y2+'px'; 
document.getElementById("cowboytwo").style.left = x2+'px'; 

你可能要檢查你的代碼順便說一下，重複的變量也是如此。

AFAIK dest_x和dest_x2例如都是相同的。

Answer 2

簡單移動

/* Y is not relevant since you only move it on X axis */ 

var position1 = 100; 
var position2 = 100; 

var dest  = 800; //Or any given value 

function move() { 
    var step1 = Math.floor(1 + (10 * Math.random())); 
    var step2 = Math.floor(1 + (10 * Math.random())); 

    position1 += step1; 
    position2 += step2; 

    document.getElementById("cowboy").style.left  = position1+'px'; 
    document.getElementById("cowboytwo").style.left = position2+'px'; 



    if(position1 < dest && position2 < dest) { 
     window.setTimeout('move()',100); 
    } else { 
     //We have the winner 
     if(position1 > dest) alert("Winner is Cowboy1"); 
     if(position2 > dest) alert("Winner is Cowboy2"); 

     //Its also possible that both of them pass target value at the same step 
    } 
}