HTML and CSS Reference
In-Depth Information
//Draw circle moving
context
.
fillStyle
=
"#000000"
;
context
.
beginPath
();
context
.
arc
(
xt
,
yt
,
5
,
0
,
Math
.
PI
*
2
,
true
true
);
context
.
closePath
();
context
.
fill
();
}
var
var
p0
=
{
x
:
60
,
y
:
10
};
var
var
p1
=
{
x
:
70
,
y
:
200
};
var
var
p2
=
{
x
:
125
,
y
:
295
};
var
var
p3
=
{
x
:
350
,
y
:
350
};
var
var
ball
=
{
x
:
0
,
y
:
0
,
speed
:
.
01
,
t
:
0
};
var
var
points
=
new
new
Array
();
theCanvas
=
document
.
getElementById
(
"canvasOne"
);
context
=
theCanvas
.
getContext
(
"2d"
);
function
function
gameLoop
() {
window
.
setTimeout
(
gameLoop
,
20
);
drawScreen
()
}
gameLoop
();
}
<
/script>
</head>
</head>
<body>
<body>
<div
<div style=
"position: absolute; top: 50px; left: 50px;"
>
<canvas
<canvas id=
"canvasOne"
width=
"500"
height=
"500"
>
Your browser does not support HTML5 Canvas.
</canvas>
</canvas>
</div>
</div>
</body>
</body>
</html>
</html>