javascriptでマウスの動きを再現

Question

最近私はマウスの記録について質問しました。今私はそれを再生する方法を理解する必要があります。

最近の質問：私は、現在のページと同一のコピーを作成するためにPHPを使用しますhttps://stackoverflow.com/questions/8129723/record-mouse-movement-with-javascript

、その後、私はそれで再生スクリプトを挿入します。スクリプトは、時間に関連して複数のxおよびy座標に基づいて絶対配置された画像を追加し、移動させる（mousemovementを示すために）。

複数のmousemovementsを再生するための良い方法がありますか？

<input style="width:100%" type="text" name="onlyforstackoverflow1" value="0" size="4"><br> 
<input style="width:100%" type="text" name="onlyforstackoverflow2" value="0" size="4"> 



<script> 

// I want this (a very long array with x-cordinates, y-cordinates and time from pageload) 

var very_long_array = [1,2,1000,2,22,2000,3,33,3645,4,44,3456]; 

// To become the same as this 

setTimeout("document.Show.onlyforstackoverflow1.value = 1;document.Show.onlyforstackoverflow2.value = 11;",100) 
setTimeout("document.Show.onlyforstackoverflow1.value = 2;document.Show.onlyforstackoverflow2.value = 22;",200) 
setTimeout("document.Show.onlyforstackoverflow1.value = 3;document.Show.onlyforstackoverflow2.value = 33;",364) 
setTimeout("document.Show.onlyforstackoverflow1.value = 4;document.Show.onlyforstackoverflow2.value = 44;",453) 


// in the real script it will be moving around an image instead... 

</script> 

Answer 1

var dataList = [ 1, 2, 1000, 2, 22, 2000 ], // the long big array 
    preTime = 0; 

function run() { 
    var parts = dataList.splice(0, 3), // after splice, dataList will be auto updated 
     nowTime; 

    if (parts.length == 3) { 
     nowTime = parts[ 2 ]; 

     setTimeout(function() { 
      replay(parts[ 0 ], parts[ 1 ]); // x = parts[ 0 ], y = parts[ 1 ] 

      preTime = nowTime; 
      // continue run next replay 
      run(); 
     }, nowTime - preTime); 
    } 
} 

function replay(x, y) { 
    // do something with x, y; 
    // document.Show.onlyforstackoverflow1.value = x; 
    // document.Show.onlyforstackoverflow2.value = y; 
} 

// start 
run(); 

ちょうどあなたがこれは私にとって非常に便利です...しかし、私はまた、一時停止を統合したい