OLD | NEW |
1 <html> | 1 <html> |
2 <head> | 2 <head> |
3 <style> | 3 <style> |
4 div { background: -webkit-canvas(squares); width:600px; height:600px; border:2p
x solid black } | 4 div { background: -webkit-canvas(squares); width:600px; height:600px; } |
5 </style> | 5 </style> |
6 | 6 |
7 <script type="application/x-javascript"> | 7 <script type="application/x-javascript"> |
8 function draw(w, h) { | 8 function draw(w, h) { |
9 var ctx = document.getCSSCanvasContext("2d", "squares", w, h); | 9 var ctx = document.getCSSCanvasContext("2d", "squares", w, h); |
10 | 10 |
11 ctx.fillStyle = "rgb(200,0,0)"; | 11 ctx.fillStyle = "rgb(200,0,0)"; |
12 ctx.fillRect (10, 10, 55, 50); | 12 ctx.fillRect (10, 10, 55, 50); |
13 | 13 |
14 ctx.fillStyle = "rgba(0, 0, 200, 0.5)"; | 14 ctx.fillStyle = "rgba(0, 0, 200, 0.5)"; |
15 ctx.fillRect (30, 30, 55, 50); | 15 ctx.fillRect (30, 30, 55, 50); |
16 } | 16 } |
17 </script> | 17 </script> |
18 </head> | 18 </head> |
19 <body onload="draw(300, 300)"> | 19 <body onload="draw(300, 300)"> |
20 <div></div> | 20 <div></div> |
21 </body> | 21 </body> |
22 </html> | 22 </html> |
OLD | NEW |