Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
branch: timelapse
Fetching contributors…

Cannot retrieve contributors at this time

43 lines (38 sloc) 1.07 kb
<!DOCTYPE html>
<html>
<head>
<style>
#container {
width: 300px;
height: 300px;
background-image: -webkit-canvas(sourceCanvas);
background-size: 100%;
display: inline-block;
}
</style>
</head>
<body>
<p>This test passes if two green squares are displayed below.</p>
<div>
<div style="display: inline-block">
<div id="container"></div>
</div>
<div id="canvas-container" style="display: inline-block"></div>
</div>
<script>
var ctx = document.getCSSCanvasContext('2d', 'sourceCanvas', 300, 300);
var canvas = ctx.canvas;
function asyncDraw2() {
ctx.fillStyle = "green";
ctx.fillRect(0, 0, 300, 300);
}
function asyncDraw1() {
ctx.fillStyle = "red";
ctx.fillRect(0, 0, 300, 300);
window.webkitRequestAnimationFrame(asyncDraw2);
}
window.webkitRequestAnimationFrame(asyncDraw1);
document.querySelector('#canvas-container').appendChild(canvas);
</script>
</body>
</html>
Jump to Line
Something went wrong with that request. Please try again.