|
1 <!DOCTYPE HTML> |
|
2 <html> |
|
3 <head> |
|
4 <title>Testing compositing of component alpha layer with complex visible region</title> |
|
5 <style> |
|
6 body { background:white; } |
|
7 #d { |
|
8 position:absolute; |
|
9 top:200px; |
|
10 left:200px; |
|
11 font-size:30px; |
|
12 transform:rotate(30deg); |
|
13 -moz-transform:rotate(30deg); |
|
14 background:url(100x80-white-rect-top-right.png); |
|
15 } |
|
16 canvas { display:block; } |
|
17 span { display:block; background:rgba(200,200,200, 0.4); height:40px; } |
|
18 </style> |
|
19 </head> |
|
20 <body> |
|
21 <div id="d"><span style="width:20px"><canvas id="c" width="20" height="20"></canvas>XYZ</span> |
|
22 <span style="width:100px;"></span> |
|
23 </div> |
|
24 <script> |
|
25 var ctx = document.getElementById("c").getContext("2d"); |
|
26 ctx.fillStyle = "lime"; |
|
27 ctx.fillRect(5,5,5,5); |
|
28 </script> |
|
29 </body> |
|
30 </html> |