Question

工作原理：

按“录制”按钮开始点击红色div，黑框将开始跟随你的点击，只使用黑盒内的鼠标滚轮来调整它。完成后，按播放按钮。重置按钮可重置坐标和计数器。

这不完美，我是jQuery的初学者，但至少它有用......

我正在写这个问题，因为我想实现某种计时器，以毫秒为单位，每毫秒存储在一个数组中。并且在该数组中，对于每毫秒，存储当前坐标和框的大小，因此当您运行它时，它将在您“记录”的确切时间间隔之后移动并调整框的大小。

例如：

00:00 - top:0px, left:0px, width:50px, height:50px
00:10 - top:0px, left:0px, width:50px, height:50px
00:20 - top:0px, left:0px, width:50px, height:50px
00:30 - top:0px, left:0px, width:50px, height:50px
00:40 - top:110px, left:20px, width:50px, height:50px
...
01:40 - top:110px, left:20px, width:70px, height:70px
01:50 - top:310px, left:250px, width:70px, height:70px
...
04:20 - top:17px, left:231px, width:10px, height:10px
...
10:50 - top:502px, left:354px, width:100px, height:100px

我希望我解释得很好..

Answer 1

你走了：http://jsfiddle.net/markasoftware/dEXpY/26/ 对不起，代码中没有任何评论，所以你必须自己搞清楚。我还修复了我在你的问题的评论中说的调整大小的错误，我也做了这个，当你点击开始时，记录按钮中的文字会变回记录。

Answer 2

我的方法是使用

new Date().getTime(); //  gets the time value in milliseconds from a current date.

新变量：

clickTime = [];
timeDiffs = [];
start = 0;

首先记录按下记录按钮的开始时间。然后，每次点击事件发生时，以当前时间（以毫秒为单位）更新 clickTime 。

然后，在点击事件中执行以下操作：

if(i == 0){
  timeDiffs[i] = new Date().getTime() - startTime;
}else{
  timeDiffs[i] = new Date().getTime() - clickTime[i-1];
}

首次计算当前时间与开始之间的时差。对于下一次点击，从当前时间减去最后一次 clickTime ，这样我们就可以得出相应的点击次数（以毫秒为单位）。

这就是全部，现在只是

$(".inner").animate( { left: arrX[i], top: arrY[i]}, timeDiffs[i]);

使用JSFiddle：http://jsfiddle.net/vARwz/

我发现你想要在确切的时间间隔后做事情，所以也许你可以使用jQuery .delay（）方法。

我希望，我给了你一个线索，如何做你想做的事。

jQuery记录/播放鼠标移动

2 个答案: