Thu, 22 Jan 2015 13:21:57 +0100
Incorporate requested changes from Mozilla in review:
https://bugzilla.mozilla.org/show_bug.cgi?id=1123480#c6
1 <!doctype html>
2 <html>
3 <head>
4 <style type="text/css">
5 #one {
6 position:absolute;
7 left:0px; top:0px;
8 z-index:4;
9 }
10 #two {
11 position:absolute;
12 top:100px; left:100px;
13 background-color:rgb(0,0,0,0);
14 z-index:3;
15 }
16 #three {
17 position:absolute;
18 left:100px; top:100px;
19 width:200px; height:200px;
20 background-color: rgb(255,0,0);
21 opacity:0.6;
22 z-index:2;
23 }
24 #four {
25 position:absolute;
26 top:100px; left:100px;
27 z-index:1;
28 }
29 </style>
30 <script type="text/javascript">
31 function paintCanvas() {
32 var canvas = document.getElementById("two");
33 var ctx = canvas.getContext("2d");
34 ctx.fillStyle = "rgba(255,0,0, 0.6)";
35 ctx.fillRect(0,0, 200,200);
36 }
37 </script>
38 </style>
39 </head>
40 <body onload="paintCanvas();">
41 <embed id="four" type="application/x-test" width="200" height="200"
42 drawmode="solid" color="FFFF0000"></embed>
43 <div id="three"></div>
44 <canvas id="two" width="200" height="200"></canvas>
45 <embed id="one" type="application/x-test" width="400" height="400"
46 drawmode="solid" color="9900FF00"></embed>
47 </body>
48 </html>