| OLD | NEW |
| 1 <html> | 1 <html> |
| 2 <head> | 2 <head> |
| 3 <title>There should be four bars, equivalent except for the length of the bar.</
title> | 3 <title>There should be four bars, equivalent except for the length of the bar.</
title> |
| 4 <style> | 4 <style> |
| 5 | 5 |
| 6 div | 6 div |
| 7 { | 7 { |
| 8 width: 200px; | 8 width: 200px; |
| 9 height: 50px; | 9 height: 50px; |
| 10 } | 10 } |
| 11 | 11 |
| 12 #compositeTiledNormal | 12 #compositeTiledNormal |
| 13 { | 13 { |
| 14 background-image: url(resources/stripes-large.png); | 14 background-image: url(resources/stripes-large.png); |
| 15 -webkit-transform: translateZ(0); | 15 transform: translateZ(0); |
| 16 background-size: 10px 50px; | 16 background-size: 10px 50px; |
| 17 } | 17 } |
| 18 | 18 |
| 19 #compositeTiledCrossfade | 19 #compositeTiledCrossfade |
| 20 { | 20 { |
| 21 background-image: -webkit-cross-fade(url(resources/stripes-large.png), url(r
esources/stripes-small.png), 1%); | 21 background-image: -webkit-cross-fade(url(resources/stripes-large.png), url(r
esources/stripes-small.png), 1%); |
| 22 -webkit-transform: translateZ(0); | 22 transform: translateZ(0); |
| 23 background-size: 10px 50px; | 23 background-size: 10px 50px; |
| 24 } | 24 } |
| 25 | 25 |
| 26 | 26 |
| 27 #normal | 27 #normal |
| 28 { | 28 { |
| 29 background-image: url(resources/stripes-large.png); | 29 background-image: url(resources/stripes-large.png); |
| 30 background-size: 10px 50px; | 30 background-size: 10px 50px; |
| 31 background-repeat: no-repeat; | 31 background-repeat: no-repeat; |
| 32 } | 32 } |
| 33 | 33 |
| 34 #crossfade | 34 #crossfade |
| 35 { | 35 { |
| 36 background-image: -webkit-cross-fade(url(resources/stripes-large.png), url(r
esources/stripes-small.png), 1%); | 36 background-image: -webkit-cross-fade(url(resources/stripes-large.png), url(r
esources/stripes-small.png), 1%); |
| 37 background-size: 10px 50px; | 37 background-size: 10px 50px; |
| 38 background-repeat: no-repeat; | 38 background-repeat: no-repeat; |
| 39 } | 39 } |
| 40 | 40 |
| 41 | 41 |
| 42 </style> | 42 </style> |
| 43 </head> | 43 </head> |
| 44 <body> | 44 <body> |
| 45 <div id="compositeTiledNormal"></div><br/> | 45 <div id="compositeTiledNormal"></div><br/> |
| 46 <div id="compositeTiledCrossfade"></div> | 46 <div id="compositeTiledCrossfade"></div> |
| 47 <br/><br/> | 47 <br/><br/> |
| 48 <div id="normal"></div><br/> | 48 <div id="normal"></div><br/> |
| 49 <div id="crossfade"></div> | 49 <div id="crossfade"></div> |
| 50 </body> | 50 </body> |
| 51 </html> | 51 </html> |
| OLD | NEW |