Воспроизвести движение мыши с помощью javascript

Недавно я задал вопрос о ЗАПИСИ мыши. Теперь мне нужно выяснить, как это воспроизвести.

Недавний вопрос: https://stackoverflow.com/questions/8129723/record-mouse-movement-with-javascript

Я буду использовать PHP, чтобы сделать идентичную копию текущей страницы, затем я вставлю в нее скрипт воспроизведения. Сценарий будет добавлять и перемещать изображение с абсолютным позиционированием в соответствии с несколькими координатами x и y относительно времени (для иллюстрации движения мыши).

Есть ли хорошие методы (лучше, чем ниже) для воспроизведения нескольких движений мыши?

<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>

javascript mousemove replay
person Hakan    schedule 15.11.2011    source источник
comment
Это очень полезно для меня... но я также хочу интегрировать функции паузы и возобновления воспроизведения. Я искал его, но ответы доступны только для случаев setTimeout, а не для setTimeout внутри рекурсивной функции. Так что можете ли вы пролить свет на то, как это сделать. Заранее спасибо   -  person SkillsIndexOutOfBounds    schedule 10.07.2014

Ответы (1)


arrow_upward
3
arrow_downward 

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();

Просто используйте setTimeout для выполнения задачи, вам не нужно писать каждую задачу как оператор :-)

person brookslee    schedule 15.11.2011
comment
Это очень полезно для меня... но я также хочу интегрировать функции паузы и возобновления воспроизведения. Я искал его, но ответы доступны только для случаев setTimeout, а не для setTimeout внутри рекурсивной функции. Так что можете ли вы пролить свет на то, как это сделать. Заранее спасибо - person SkillsIndexOutOfBounds; 10.07.2014