| <!DOCTYPE HTML> |
| <head> |
| <style> |
| div { |
| width: 130px; |
| height: 130px; |
| background-color: green; |
| float: left; |
| margin: 5px; |
| } |
| </style> |
| <script type="text/javascript"> |
| if (window.testRunner) |
| window.testRunner.waitUntilDone(); |
| |
| var blueWhite1px400msGif = "url('data:image/gif;base64,R0lGODlhAQABAJECAP///wAt0v///wAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQJKAACACwAAAAAAQABAAACAkwBACH5BAkoAAIALAAAAAABAAEAAAICRAEAOw==')"; |
| |
| window.onload = function () { |
| var list = document.getElementsByTagName('div'); |
| for (var i = 0; i < list.length; i++) |
| list[i].style.backgroundImage = blueWhite1px400msGif; |
| setTimeout(function () { |
| if (window.testRunner) |
| window.testRunner.notifyDone(); |
| }, 500); |
| }; |
| </script> |
| </head> |
| <!-- This file should contain a gif on top of a background color with every type of blending. --> |
| <body> |
| <div style="background-blend-mode: normal, normal"></div> |
| <div style="background-blend-mode: multiply, normal"></div> |
| <div style="background-blend-mode: screen, normal"></div> |
| <div style="background-blend-mode: darken, normal"></div> |
| <div style="background-blend-mode: lighten, normal"></div> |
| <div style="background-blend-mode: color-dodge, normal"></div> |
| <div style="background-blend-mode: color-burn, normal"></div> |
| <div style="background-blend-mode: hard-light, normal"></div> |
| <div style="background-blend-mode: soft-light, normal"></div> |
| <div style="background-blend-mode: difference, normal"></div> |
| <div style="background-blend-mode: exclusion, normal"></div> |
| </body> |
