| OLD | NEW |
| 1 <html> | 1 <html> |
| 2 <style> | 2 <style> |
| 3 div | 3 div |
| 4 { | 4 { |
| 5 width: 100px; | 5 width: 100px; |
| 6 height: 100px; | 6 height: 100px; |
| 7 margin: 10px; | 7 margin: 10px; |
| 8 background-repeat: no-repeat; | 8 background-repeat: no-repeat; |
| 9 } | 9 } |
| 10 </style> | 10 </style> |
| 11 <!--The first cross-fade should appear as a 100% green square, 10x10px.--> | 11 <!--The first cross-fade should appear as a 100% green square, 10x10px.--> |
| 12 <div style="background-image: -webkit-cross-fade(url(resources/red-100.png), url
(resources/green-10.png), 100%);"></div> | 12 <div style="background-image: -webkit-cross-fade(url(resources/red-100.png), url
(resources/green-10.png), 100%);"></div> |
| 13 <!--The second cross-fade should appear as a 100% green square, 100x100px.--> | 13 <!--The second cross-fade should appear as a 100% green square, 100x100px.--> |
| 14 <div style="background-image: -webkit-cross-fade(url(resources/green-100.png), u
rl(resources/red-10.png), 0%);"></div> | 14 <div style="background-image: -webkit-cross-fade(url(resources/green-100.png), u
rl(resources/red-10.png), 0%);"></div> |
| 15 <!--The third cross-fade should appear as a blue-green square, 55x55px.--> | 15 <!--The third cross-fade should appear as a blue-green square, 55x55px.--> |
| 16 <div style="background-image: -webkit-cross-fade(url(resources/blue-100.png), ur
l(resources/green-10.png), 50%);"></div> | 16 <div style="background-image: -webkit-cross-fade(url(resources/blue-100.png), ur
l(resources/green-10.png), 50%);"></div> |
| 17 </html> | 17 </html> |
| OLD | NEW |