-
Notifications
You must be signed in to change notification settings - Fork 32
/
timeline-canvas.html
37 lines (36 loc) · 1.23 KB
/
timeline-canvas.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Canvas For Timeline</title>
</head>
<body>
<div style="margin: 0;padding: 0;">
<canvas id="timeline" width="1500" height="62" style="cursor: pointer;border:1px solid #2b2f33;background-color: #2b2f33;" ondragstart="return false;"></canvas>
<br>
<button id="setTimeMove">setTimeMove</button>
<button id="stopTimeMove">stopTimeMove</button>
<button id="setTime">setTime</button>
<input type="text" id="setTimeValue"/>
<script src="./jquery-1.10.2.js"></script>
<script src="./timeline-canvas.js"></script>
<script>
var setTimeMove = null;
$("#setTimeMove").click(function(){
setTimeMove = setInterval(function(){
set_time_to_middle(new Date().getTime());
},1000)
})
$("#stopTimeMove").click(function(){
clearInterval(setTimeMove);
})
$("#setTime").click(function(){
var time = new Date($("#setTimeValue").val()).getTime();
set_time_to_middle(time);
})
$("#timeline").mouseup(function(){
var a = returnMouseupTime();
console.log("mouseupTime = "+new Date(a));
})
</script>
</div>