OLD | NEW |
1 <script> | 1 <script> |
2 if (window.testRunner) | 2 if (window.testRunner) |
3 window.testRunner.dumpAsTextWithPixelResults(); | 3 window.testRunner.dumpAsTextWithPixelResults(); |
4 </script> | 4 </script> |
5 <svg xmlns="http://www.w3.org/2000/svg" width="0" height="0" version="1.1"> | 5 <svg xmlns="http://www.w3.org/2000/svg" width="0" height="0" version="1.1"> |
6 <defs> | 6 <defs> |
7 <filter id="xor" color-interpolation-filters="sRGB"> | 7 <filter id="xor" color-interpolation-filters="sRGB"> |
8 <feColorMatrix type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0
0 0.5 0" result="transp"/> | 8 <feColorMatrix type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0
0 0.5 0" result="transp"/> |
9 <feOffset dx="10" dy="10"/> | 9 <feOffset dx="10" dy="10"/> |
10 <feComposite in2="transp" operator="xor"/> | 10 <feComposite in2="transp" operator="xor"/> |
11 </filter> | 11 </filter> |
12 </defs> | 12 </defs> |
13 </svg> | 13 </svg> |
14 <style> | 14 <style> |
15 li { | 15 li { |
16 margin: 10px; | 16 margin: 10px; |
17 width: 160px; | 17 width: 160px; |
18 height: 90px; | 18 height: 90px; |
19 background-image: url(resources/reference.png); | 19 background-image: url(resources/reference.png); |
20 display: block; | 20 display: block; |
21 float: left; | 21 float: left; |
22 -webkit-transform:translateZ(0); | 22 transform:translateZ(0); |
23 } | 23 } |
24 </style> | 24 </style> |
25 <ul> | 25 <ul> |
26 <li style="-webkit-filter: blur(3px)"/> | 26 <li style="-webkit-filter: blur(3px)"/> |
27 <li style="-webkit-filter: brightness(0.5)"/> | 27 <li style="-webkit-filter: brightness(0.5)"/> |
28 <li style="-webkit-filter: contrast(3)"/> | 28 <li style="-webkit-filter: contrast(3)"/> |
29 <li style="-webkit-filter: drop-shadow(5px 5px 5px blue)"/> | 29 <li style="-webkit-filter: drop-shadow(5px 5px 5px blue)"/> |
30 <li style="-webkit-filter: grayscale(0.5)"/> | 30 <li style="-webkit-filter: grayscale(0.5)"/> |
31 <li style="-webkit-filter: hue-rotate(180deg)"/> | 31 <li style="-webkit-filter: hue-rotate(180deg)"/> |
32 <li style="-webkit-filter: invert(1.0)"/> | 32 <li style="-webkit-filter: invert(1.0)"/> |
33 <li style="-webkit-filter: opacity(0.5)"/> | 33 <li style="-webkit-filter: opacity(0.5)"/> |
34 <li style="-webkit-filter: saturate(10)"/> | 34 <li style="-webkit-filter: saturate(10)"/> |
35 <li style="-webkit-filter: sepia(1.0)"/> | 35 <li style="-webkit-filter: sepia(1.0)"/> |
36 <li style="-webkit-filter: url(#xor)"/> | 36 <li style="-webkit-filter: url(#xor)"/> |
37 </ul> | 37 </ul> |
OLD | NEW |