зеркало из https://github.com/mozilla/gecko-dev.git
34 строки
933 B
HTML
34 строки
933 B
HTML
|
<!DOCTYPE html>
|
|||
|
|
|
|||
|
|
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
|
|||
|
|
<head>
|
|||
|
|
<meta charset="utf-8" />
|
|||
|
|
<title></title>
|
|||
|
|
<script type="text/javascript">
|
|||
|
|
function paintCanvas() {
|
|||
|
|
var elem = document.getElementById("mycanv");
|
|||
|
|
var ctx = elem.getContext('2d');
|
|||
|
|
|
|||
|
|
ctx.fillStyle = 'white';
|
|||
|
|
ctx.fillRect(0, 0, 200, 200);
|
|||
|
|
ctx.beginPath();
|
|||
|
|
ctx.arc(150, 150, 100, 0, Math.PI * 2, true);
|
|||
|
|
ctx.closePath();
|
|||
|
|
ctx.clip();
|
|||
|
|
|
|||
|
|
// create radial gradient
|
|||
|
|
var grd = ctx.createRadialGradient(110, 110, 42, 110, 110, 121);
|
|||
|
|
grd.addColorStop(0, '#FFFFFF');
|
|||
|
|
grd.addColorStop(1, '#E5E5E5');
|
|||
|
|
|
|||
|
|
ctx.fillStyle = grd;
|
|||
|
|
// This should be completely clipped out!
|
|||
|
|
ctx.fillRect(0, 0, 1, 1);
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
</head>
|
|||
|
|
<body onload="paintCanvas();">
|
|||
|
|
<canvas width=200 height=200 moz-opaque="true" id="mycanv"></canvas>
|
|||
|
|
</body>
|
|||
|
|
</html>
|